JavaScript之DOM-2 读取和修改节点信息(节点信息、元素的内容、属性)

一、节点信息

节点名称 nodeName

  - nodeName: 节点的名称，String 类型属性

      - nodeName 是只读的

节点类型 nodeType

  - nodeType:节点类型，Number 类型属性

节点值 nodeValue

  - nodeValue:节点的值，String类型属性

二、元素的内容

HTML 内容

  - 元素节点对象的innerHTML属性读取或设置元素节点中的HTML内容

文本内容

  - 元素节点对象的textContent属性用于读取或设置元素节点中的文本内容----子HTML标签会被踢除

nodeValue 与 textContent

有争议的 innerText

  - 标准 DOM 操作中，并没有innerText属性;

  - IE8 之前的IE浏览器不支持标准的textContent属性，使用innerText实现类似的功能，目前此属性已被大多数浏览器所兼容，但Friefox仍不支持此属性

  - innerText与标准的textContent属性并不完全相同

三、属性

属性集合

  - 元素节点的attributes属性返回节点的属性集合，即NamesNodeMap----一个类数组对象

读取属性

  - 可以使用如下几种方式读取某个属性的值:

      - element.attributes[下标].value

      - element.attributes['属性名']

      - element.getAttributeNode('属性名').value

      - element.getAttribute('属性名')

修改属性

  - 可以使用如下方法设置元素的属性:

      - element.setAttribute(name,value); // IE8及以下版本不支持此方法

      - element.setAttributeNode(attrNode);

移除属性

  - 可以使用如下两种方式删除一个属性:

      - element.removeAttribute('属性名'); 

      - element.removeAttributeNode(attrNode);

判断属性

  - 如下方法可以用于判定元素是否拥有指定属性:

      - element.hasAttribute('属性名');   //true 或 false

      - element.hasAttributes();          //是否拥有属性 // IE8及以下版本不支持此方法

总结：本章内容主要介绍了  JavaScript DOM 读取和修改节点信息(节点信息、元素的内容、属性)

转载于:https://blog.51cto.com/jasonteach/1758931