XML DOM firstChild 属性

  • 定义和使用

    firstChild 属性返回所选元素的第一个子节点。
    如果所选节点没有子节点,则此属性返回NULL。
  • 浏览器支持

    Internet Explorer Chrome FireFox Safari Opera
    8.0(包含)以上支持 4.0(包含)以上支持 2.0(包含)以上支持 3.0(包含)以上支持 9.0(包含)以上支持
    所有主流的浏览器均支持 firstChild 属性。
  • 语法

    elementNode.firstChild
    

    参数

    参数 类型 描述
  • 示例

    以下代码片段将 "books.xml" 加载到 xmlDoc 中,并获得第一个子节点:
    <!DOCTYPE html>
    <html>
    <body>
    
    <p id="demo"></p>
    
    <script>
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            myFunction(xhttp);
        }
    };
    xhttp.open("GET", "books.xml", true);
    xhttp.send();
    
    function get_firstchild(n) {
        var x = n.firstChild;
        while (x.nodeType != 1) {
            x = x.nextSibling;
        }
        return x;
    }
    
    function myFunction(xml) {
        var x, i, txt, xmlDoc, firstNode, xmlDoc;
        xmlDoc = xml.responseXML;
        x = xmlDoc.documentElement;
        txt = "";
        firstNode = get_firstchild(x);
        for (i = 0; i < firstNode.childNodes.length; i++) { 
            if (firstNode.childNodes[i].nodeType == 1) {
                //Process only element nodes
                txt += firstNode.childNodes[i].nodeName + 
                " = " + 
                firstNode.childNodes[i].childNodes[0].nodeValue + "<br>";
            }
        }
        document.getElementById("demo").innerHTML = txt; 
    }
    </script>
    
    </body>
    </html>
    
    尝试一下
    注意:Firefox 和大多数其他浏览器会将空白或新行视为文本节点,而 Internet Explorer 则不会。 因此,在上面的示例中,我们具有一个检查第一个子节点的节点类型的函数。
    元素节点的 nodeType 为 1,因此,如果第一个子节点不是元素节点,它将移至下一个节点,并检查该节点是否为元素节点。 这一直持续到找到第一个子节点(必须是元素节点)为止。 这样,结果将在所有浏览器中都是正确的。