打好基础,查漏补缺
基础是重中之重
dom
dom是html和xml的文档编程接口。即一系列操作html和xml的方法集合。
Dom结构树
代表整个文档。html是文档中的根标签。
Node Document HTMLDocument
XMLDocument
characterData Text
Comment
Element HTMLElement HTMLHeadElement
HTMLTitleElement
attr
Document的原型上定义了一些属性, documentElement指代文档根元素 即html
getElementById 定义在Document.prototype上。
HTMLDocument 的原型上定义了一些属性, body,head分别指代相应标签
getElementsByName 定义在HTMLDocument.prototype上。
getElementsByClassName ,querySelector, querySelectorAll ,getElementsByTagName 在 Document.prototype和 Element.rpototype上均有定义.
查看元素节点
1.document.getElementById() // ie8以下会查出name值相同的
2.document.getElementsByTagName()
3.document.getElementsByName()
4.document.getElementsByClassName() // ie8及以下不支持
css选择器 但是是静态的,一个副本。
5.document.querySelector() // ie7及以下不支持
6.document.querySelectorAll()
遍历节点树
selector.parentNode
selector.childNode
selector.firstChild
selector.lastChild
selector.nextSibling
selector.previousSibling
遍历元素节点树
selector.parentElement
selector.children
selector.firstElementChild
selector.lastElementChild
selector.nextElementSibling
selector.previousElementSibling
元素节点的操作
document.createElement
document.createTextNode
document.createComment
document.appendChild()
document.insertBefore(a,b)
parent.removeChild()
Selector.remove()
parent.replaceChild(new,old)
节点的四个属性
1.nodeName
2.nodeType
3.nodeValue
4.attributes
nodex.hasChildNodes() // 判断是否有子节点 window.getComputedStyle(ele,bull) // 获取计算样式表