检查JavaScript中两个元素是否相等

Question

为什么elementA === elementB产生的结果与elementB.isEqualNode（elementA）不同？

在检查完此答案后，是否有办法检查两个DOM元素是否相等？我正在尝试使用来检查javascript中两个元素是否相等===。出人意料的是，当元素A和B是相同的A === B回报false，而B.isEqualNode(A)回报true。

这是一个例子：

的HTML：

<div>   
   <h1>Test</h1>
</div>

JavaScript：

var inMemoryDiv = document.createElement('div');
var inMemoryH1 = document.createElement('h1');
inMemoryH1.innerHTML = "Test";
inMemoryDiv.appendChild(inMemoryH1);

var h1 = document.getElementsByTagName('h1')[0];
alert(h1 === inMemoryH1); // false
alert(inMemoryH1.isEqualNode(h1)); // true
alert(h1.innerHTML === inMemoryH1.innerHTML); // true

在小提琴中复制。

为什么会这样呢？

Answer 1

isEqualNode在DOM级别3中定义，因此：

此方法测试可以用进行测试的节点是否相等，而不是相同（即，两个节点是否是对同一对象的引用）Node.isSameNode()。所有相同的节点也将相等，尽管可能并非如此。

当且仅当满足以下条件时，两个节点才相等：

• 这两个节点的类型相同。
• 以下字符串属性相等：nodeName，localName，namespaceURI，prefix，nodeValue。这是：它们都为null，或者它们具有相同的长度，并且是相同的字符。
• 属性NamedNodeMaps相等。这是：它们都为null，或者它们具有相同的长度，并且对于一个映射中存在的每个节点，在另一个映射中存在一个节点，并且该节点是相等的，尽管不一定具有相同的索引。
• 子节点NodeList相等。这是：它们都为null，或者它们具有相同的长度，并且在相同的索引处包含相等的节点。注意规范化会影响相等性。为了避免这种情况，应该在比较节点之前对节点进行标准化。

Answer 2

您创建一个新元素。这与现有的不太一样。它们是平等的，因为它们具有相同的结构和内容。这就像两个字符串对象相等，如果它们包含相同的文本，但如果您单独创建它们，则它们不相同。

这是一个更简单的情况：

var div1 = document.createElement('div');
var div2 = document.createElement('div');
alert(div1 === div2); // false
alert(div1.isEqualNode(div2)); // true