What does item mean in html?-HTML Tutorial-php.cn

What does item mean in html?

醉折花枝作酒筹

Release： 2023-01-06 11:16:38

Original

10318 people have browsed it

In HTML, item means the node located at the specified index in the node list, and the syntax format is "document.element object.childNodes.item(value)". Nodes are ordered in the order they appear in the source code, and the index of the node list starts with 0.

What does item mean in html?

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

I never knew that javascript has a function similar to eq() in jQ. It turns out that the item() of native javascript has similar functions:

Since it is native javascript, I will first learn about children and childNodes. Difference:

1, childNodes: It is a standard attribute, which returns a collection of child elements of the specified element, including HTML nodes, all attributes, and text nodes. You can determine which type of node it is by nodeType. Only when nodeType==1 is the element node, 2 is the attribute node, and 3 is the text node.

2, children: non-standard attribute, which returns the set of child elements of the specified element. But it only returns HTML nodes, not even text nodes. Although it is not a standard DOM attribute, it is supported by almost all browsers like the innerHTML method.

Example

Return the first child node of the element:

document.body.childNodes.item(0);

Copy after login

Test code: w3c address to test

<!DOCTYPE html>
<html>
<body>
<p id="p1">
 <p class="demo">点击按钮来获得 body 元素0个子节点的名称。</p>
 <p class="demo">点击按钮来获得 body 元素1个子节点的名称。</p>
 <p class="demo">点击按钮来获得 body 元素2个子节点的名称。</p>
 <p class="demo">点击按钮来获得 body 元素3个子节点的名称。</p>
</p>
 <p id="demo"></p>

<button onclick="myFunction()">试一下</button>

<script>
function myFunction()
{
var x = document.getElementById("demo");
var p1 =  document.getElementById("p1"); 
x.innerHTML = p1.childNodes.item(3).nodeName; 
//x.innerHTML = p1.children.item(1).nodeName; //children得到的是元素节点
}
</script>

</body>
</html>

Copy after login

The following explains the usage of item() ：

Definition and usage

item() method The node at the specified index in the node list.

The following two syntaxes produce the same result:

document.body.childNodes.item(0);
document.body.childNodes[0];

Copy after login

Recommended learning: html video tutorial

The above is the detailed content of What does item mean in html?. For more information, please follow other related articles on the PHP Chinese website!