js 对象数组遍历 DOM 模型概述(6)

参数节点包含当前节点

010000

16

当前节点包含参数节点

100000

32

浏览器私有用途

// HTML代码为

//

//

//

var div = document.getElementById('mydiv');

var input = document.getElementById('test');

div.compareDocumentPosition(input) // 20

input.compareDocumentPosition(div) / 10

上面代码中，节点div包含节点input，而且节点input在节点div的后面，所以第一个compareDocumentPosition方法返回20(二进制010100)，第二个compareDocumentPosition方法返回10（二进制001010）。

由于compareDocumentPosition返回的含义，定义在每一个比特位上，如果要检查某一种特定的含义，就需要使用比特运算符。

var head = document.head;

var body = document.body;

if(head.compareDocumentPosition(body) & 4){

console.log('文档结构正确');

}else{

console.log('不能在前面');

}

上面代码中，compareDocumentPosition的返回值与4(又称为掩码)进行与运算(&)，得到一个布尔值，表示是否在前面。

在这个方法的基础上，可以部署一些特定的函数，检查节点位置。

Node.prototype.before = function(arg){

return !!(this.compareDocumentPosition(arg) & 2);

}

nodeA.before(nodeB);

Node.isEqualNode()

isEqualNode方法返回一个布尔值，用于检查两个节点是否相等。所谓相等的节点，指的是两个节点的类型相同、属性相同、子节点相同。

var targetEI = document.getElementById('targetEI');

var firstDiv = document.getElementByTagName("div")[0];

targetEI.isEqualNode(firstDiv);

Node.normalize()

normalize方法用于清理当前节点内部的所有Text节点。他会去除空的文本节点，并且将比邻的文本节点合并成一个。

var wrapper = document.createElement("div");

wrapper.appendChild(document.createTextNode("Part 1 "));

wrapper.appendChild(document.createTextNode("Part 2 "));

wrapper.childNodes.length;

wrapper.normalize();

wrapper.childNodes.length; // 1

上面代码中使用normalize方法之前，wrapper节点有两个Text子节点。使用normalize方法之后，两个Text节点被合并成一个。

NodeList对象，HTMLCollection对象

节点都是单对象，有时需要一种数据结构，能够容纳对个节点。DOM提供两种结合对象，用于实现这种节点集合：NodeList和HTMLCollection。

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-58611-6.html