Home > Article > Web Front-end > firstchild in javascript

firstchild in javascript

阿神Original: 2017-02-25 17:36:532849browse

<ul id="contain">  
     <li><a href="http:/www.php.cn">Microsotf</a></li>  
     <li><a href="http:/www.php.cn">Yahoo</a></li>  
     <li><a href="http:/www.php.cn">Easy</a></li>  
     <li><a href="www.php.cn">W3c/Javascript</a></li>  
     <li><a href="www.php.cn">Design|Source</a></li>  
 </ul>  
var container=document.getElementById("contain");

1. Use firstChild to be the first child node under the ul element (including text nodes and HTML element nodes). So according to the standard, in your example in Firefox and Opera, Container.firstChild should get the whitespace text node. IE does not implement this. If the text node only contains whitespace characters, IE will skip it directly. So what you get through container.firstChild in IE is the li element node.

2. firstChild is the first child node among all child nodes (childNodes) of the element. If the first child node of the element does not change, the reference to firstChild will not change either. The firstChild obtained twice in a row is the same object.

Supplement: You need to understand the relationship between references and objects. firstChild is a reference to the first child node of the element. In the xx function you gave, append the object pointed to by firstChild to the end of the parent object. The object originally referenced by firstChild jumps to the end of the container object, and firstChild points to the element object that was originally ranked second. If the cycle continues like this, the links will jump back one by one.

<body>  
<ul id="action">  
    <li title="第一段文字">第一个</li>  
    <li title="第二段文字">第二个</li>  
</ul>  
<script type="text/javascript">  
    var attr_p = document.getElementById("action");  
    alert(attr_p.childNodes[1].childNodes[0].nodeValue);  
</script>  
</body>

If you want to get the text node in the first li of ul with the id of action (such as getting: the first one), you can use the method...childNodes[1].childNodes[0].nodeValue Find, use...childNodes[1].firstChild.nodeValue to also find the text node of the first li. Conclusion childNodes[0] is equivalent to firstChild. No matter when and where, it is important to access the first one of the childNodes[] array. element, we can write it as firstChild, and DOM also provides a corresponding lastChild attribute. It should be noted that for the space node problem of ff, you can use the nodeType attribute to judge the node type until the element node is found.

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：js gets the width and height of hidden elementsNext article：js gets the width and height of hidden elements

See more

firstchild in javascript

Related articles