DOM methods and properties of js summary

1.DOM acquisition element
document.getElementById ()
context.getElementsByTagName (tag) (corresponding context can get to tag all)
context.getElementsByClassName () (ie6-8 incompatible)
context.getElementsByName () (only ie6-8 It can be used to form elements)
the document.body
document.documentElement
context.querySelector () / querySelectorAll () (acquired node set does not exist static mapping DOM)
in form of way (table context.tHead tBodies rows .... ..)

 

2. Description nodes and node attributes and methods of the relationship (usually refers to the acquired element is not compatible with a general default without Node Element in particular by children childNodes parentNode ie6-8)
the childNodes (not including grandchildren, text nodes may have wrap and spaces)
Children (note that this is not childElementNodes)
firstChild / firstElementChild
lastChild / lastElementChild
parentNode
previousSibling / previousElementSibling
nextSibling / nextElementSibling

 

 

3.node common type

 

 

 

nodeType nodeName nodeValue
1 Specific elements of capital DIV tag .... null
9 #document null
3 #text Is the value of the text, including spaces and line breaks
8 #comment Text comment




 

 

4.DOM的增删改
节点
document.createElement()
document.createDocumentFragment() 
new Image
appendChild()
replaceChild()
removeChild()
insertBefore()
clone(false/true)

Property
get / set / removeAttribute ()


Style
getComputedStyle () (ie6-8 not compatible)
getCurrentStyle (applies only to ie6-8)


13 5.DOM box model attributes
the clientWidth the clientHeight clientTop clientLeft
scrollWidth the scrollHeight scrollTop scrollLeft
offsetWidth the offsetHeight the offsetTop the offsetLeft the offsetParent
only scrollTop scrollLeft other are readable and writable read-only

 

Guess you like

Origin www.cnblogs.com/xianxiaoan/p/11164694.html