DOM 元素节点

Javascript的组成：ECMAscript (js核心语法) +DOM+BOM
DOM:document object model (文本对象模型)

DOM获取元素节点方法

• getElementById() - - - 通过id名获取元素节点
• getElementsByClassName() - - -通过class名获取一组元素节点
• getElementsByTagName() - - -通过标签名获取一组元素节点
• getElementsByName() - - -通过那么属性获取一组元素节点
• querySelectorAll() - - -通过CSS形式获取一组元素
• querySelector() - - -通过CSS形式获取元素

可获取元素

• getAttribute() - - - 获取属性
• setAttribute() - - - 设置属性
• removeAttribute() - - - 移除属性
• className - - - 元素class名
• id - - -元素id名
• innerHTML - - -元素内部HTML代码
• innerTEXT - - - 元素内部文本
• style - - -元素内联样式

获取特殊标签

head = document.head - - -获取head

• title = document.title - - - 获取title的内容
• body = document.body - - -获取body
• html= document.documentElement - - -获取html
• all = document.all - - -获取所有标签

获取关系节点

• childNodes - - -当前节点的所有子节点（包括空白节点）
• children - - - 当前元素的所有子元素
• firstChild- - -当前元素的第一个子节点（包括空白节点）
• firstElementChild - - -当前元素的第一个子节点
• lastChild - - - 当前元素的最后一个子节点（包括空白节点）
• lastElementChild - - -当前元素的最后一个子节点

获取元素的父节点和兄弟节点

• parentNode | parentElement - - -当前节点的父节点
• previousSibling - - -当前元素的前一个兄弟节点（包括空白节点）
• previousElementSibling - - 当前元素的前一个兄弟节点
• nextSibling - - -当前元素的下一个兄弟节点（包括空白节点）
• nextElementSibling - - - 当前元素的下一个兄弟节点

操作节点

• createElement() 创建元素节点对象
• createTextNode() 创建文本节点对象
• removeChild - - -移除当前元素的子节点
• appendChild - - - 给当前元素添加子节点
• replaceChild - - -指定子节点替换已有节点
• inserBefore - - -当前元素前面添加子节点
• clonNode(false|ture) - - -克隆元素(浅拷贝|深拷贝)
• hasChildNodes() - - -判断是否有子节点(返回值：false:无 | ture:有)

classList对象的扩展

• 元素. classList.length - - - 查询class类名个数
• 元素. classList.add () - - - 给元素添加class的方法
• 元素. classList.remove() - - - 给元素移除class的方法
• 元素. classList.toggle() - - - 给元素切换class的方法
• 元素. classList.contains() - - - 查找元素是否包含某个类名