为何Node.ELEMENT_NODE等多个Node常量映射至同一数值？

Great question! This is a common point of confusion when diving into DOM constants, but the key insight is that these duplicate values belong to entirely separate categories of constants with distinct use cases—they never get mixed up in actual code.

Let’s Break It Down #

1. Node Type Constants (e.g., ELEMENT_NODE) #

These constants are designed to identify the type of a DOM node. You’ll use them alongside the node.nodeType property to check what kind of node you’re working with:

• Node.ELEMENT_NODE = 1: Represents HTML/XML element nodes (like <div> or <p>)
• Node.ATTRIBUTE_NODE = 2: Represents attribute nodes (though these are rarely accessed directly in modern DOM APIs)
• And so on for text nodes, comment nodes, document nodes, etc.

Example usage:

const myNode = document.querySelector('div');
if (myNode.nodeType === Node.ELEMENT_NODE) {
  console.log("This is an element node!");
}

2. Document Position Constants (e.g., DOCUMENT_POSITION_DISCONNECTED) #

These constants are part of a bitmask system used by the Node.compareDocumentPosition() method. This method returns a number that encodes the positional relationship between two nodes, and each constant corresponds to a single bit in that number:

• Node.DOCUMENT_POSITION_DISCONNECTED = 1: The two nodes are not in the same document tree
• Node.DOCUMENT_POSITION_PRECEDING = 2: The reference node comes before the compared node in the document
• Each subsequent constant uses the next power of 2 (4, 8, 16, etc.) so multiple relationships can be encoded in a single return value.

Example usage:

const nodeA = document.querySelector('#first');
const nodeB = document.querySelector('#second');
const position = nodeA.compareDocumentPosition(nodeB);

// Check if nodeB is disconnected from nodeA's tree
if (position & Node.DOCUMENT_POSITION_DISCONNECTED) {
  console.log("Nodes are in separate trees!");
}

3. Why Duplicate Values Are Harmless #

Since these two sets of constants are used in completely separate contexts:

• You never compare node.nodeType to a DOCUMENT_POSITION_* constant
• You never use a node type constant to check the result of compareDocumentPosition()

The duplicate numeric values don’t cause any ambiguity. It’s just a coincidence of how the values were assigned—node types use sequential integers, while position constants use bitmask-friendly powers of 2, and their ranges overlap at the lower numbers.

内容的提问来源于stack exchange，提问作者manjunatha_d