-
dom节点
-文档节点:整个Html文档
-元素节点:Html文档中的HTML标签
-属性节点:元素的属性
-文本节点:Html标签中的文本内容 -
dom树
-
dom事件对象
-
dom Document对象
- 通过document对象调用获取元素节点
window.onload() //会在整个页面加载完成之后才触发 为window绑定一个onload事件 window.onload = function() { alert("hello"); } document.getElementById() document.getElementsByTagName() document.getElementByName() //-通过name属性
- 通过document对象调用获取元素节点
-
dom元素对象
- 通过具体元素节点获取内容
node.innerHTML node.innerText //获取元素内部的文本内容,和innerHTML不同的是它会自动将html去除 node.nodeValue //文本节点
- 通过具体元素节点调用获取元素节点的子节点
node.getElementsByTagName() node.childNodes //-属性,表示当前节点的所有子节点 包括文本节点(注:空白文本节点) node.children //-属性,可以获取当前节点的所有子元素 node.firstElementChild //-属性,可以获取当前节点的第一个子元素 node.lastElementChild //-属性,可以获取当前节点的最后一个子元素 node.firstChild //-属性,表示当前节点的第一个子节点 node.lastChild //-属性,表示当前节点的第一个子节点
- 通过具体元素节点调用获取元素节点的父节点和兄弟节点
node.parentNode //-属性,表示当前节点的父节点 node.previousSibling //-属性,表示当前节点的前一个兄弟节点 (可能获取到空白文本节点) node.nextSibling //-属性,表示当前节点的后一个兄弟节点 (可能获取到空白文本节点) node.previousElementSibling //-属性,表示当前节点的前一个兄弟元素 node.nextElementSibling //-属性,表示当前节点的后一个兄弟元素
- 通过具体元素节点获取内容