使用JavaScript操作Dom 学习笔记

DOM编程
Dom（文档对象模型）
DOM的组成：
DOM Core（核心）
document.getElement(s)By XXXX();
2.html dom
innerHTML innerText children childNodes……
3.CSS DOM
style 

parentNode 返回节点的父节点
childNodes 返回子节点集合，childNodes[i]
firstChild 返回节点的第一个子节点，最普遍的用法是访问该元素的文本节点
lastChild 返回节点的最后一个子节点
nextSibling 下一个节点
previousSibling 上一个节点

根据层次关系访问节点
这一组新的属性比上衣组要好一点，区别是过滤换行的子节点
firstElementChild 返回节点的第一个子节点，最普遍的用法时访问该元素的文本节点
lastElementChild 返回节点的最后一个子节点
nextElementSibling 下一个节点
previousElementSibling 上一个节点

标准图片反斜杠：\\\

nodeName:节点名称
nodeValue:节点值
nodeType:节点类型
attributes[0]属性

类型          nodeType值
元素element     1
属性attr        2
文本text        3
注释comments    8
文档document    9

getAttribute("属性名")
setAttribute("属性名","属性值")

createElement(tagName)创建一个标签名为tagName的新元素节点
A.appendChild(B) 把B节点追加至A节点的末尾
insertBefore(A,B)把A节点插入到B节点之前
cloneNode(deep)复制某个指定的节点

删除和替换节点：
removeChild(node)删除指定的节点
replaceChild(newNode,oldNode)属性sttr 用其他的节点替换指定的节点
document.getElementByid("cds").currentStyle.Display   兼容id浏览器
offsetLeft  返回当前元素左边界到它上

innserHTML和innertext的区别
innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签。
innerText 指的是从起始位置到终止位置的内容,但它去除Html标签

outerHTML指的是除了包含innerHTML的全部内容外, 还包含对象标签本身。

该文章仅供参考 因个人原因需保存在一个可供分享的地方