dom2.0

获取元素的方法

**    通过选择器获取元素节点：**

document.querySelector( ‘ 选择器 ‘ )   -找到第一个符合条件的节点对象

document.querySelectorAll( ‘ 选择器’  ) -数组形式返回所有符合条件的节点对象

注意该选择器，无法动态获取页面正在添加变化的元素节点。只有原生的 getELement…才行

**    获取节点的所有样式**

chrome 获取   document.defaultView.getComputeStyle(节点,null)

ie 低版本浏览器    节点.currentStyle

兼容写法

div.currentStyle == undefined
  ? document.defaultView.getComputedStyle(div, null)
  : div.currentStyle;

获取后可以存入变量，然后调用 变量.样式名  可以个别调用。

**    创建元素节点：**

document.createElement(标签名)；

**    创建文本节点：**

document.createTextNode(文本内容);

**  插入节点**

父节点.appendChild(节点对象)  文本节点或元素节点，注意如果插入的节点是存在的，不是后面创建的，则为移动该节点到父节点下

父节点..insertBefore(新添的节点，原来的节点)//在原节点的前面新添加一个节点。

**    替换**

父节点.replaceChild(新添的节点，原来的节点)//把原来的节点替换为新的节点

**    删除**

父节点.removeChild(子节点); //删除子节点

**    克隆**

节点.cloneNode(true)，

参数为 true,把节点以及节点内的内容全部复制一份

不写默认参数为  false,只复制空标签

节点内部的内容获取

div.innerText  在节点 div 内部添加一段文本（赋值），会覆盖原文本，不识别 html 标签

div.innerHTML 在节点 div 内部添加一段文本（赋值），会覆盖原文本,但要识别 html 的标签

**  自定义属性  **

date-index = ‘ ‘  类似  title  就是方便选择查找的一个属性参数。

可以配合循环，设置为对应角标值，通过  this  调用   配合使用