Question

getElementsByTagName - 无法读取未定义的属性“长度”

2016-09-21

1011

javascript html parsing getelementsbytagname

我正在学习如何解析 javascript 节点以通过各种方式收集信息。

当我运行下面的代码时，所有代码都正常工作，直到我到达以下行：

for(var i = 0; i < olElements.childNodes.length; i++){

我收到错误：“Uncaught TypeError: Cannot read property 'length' of undefined”。

这是我的完整脚本：

<script type="text/javascript" language="JavaScript1.1">
function getNodeValue(){
    var olElement = document.getElementById("toDoList");
    var a = olElement.getElementsByTagName("li");
    console.log("The ordered list contains " + a.length + " items.\n\n");

    console.log(a[a.length - 1].lastChild.nodeValue + "\n\n");



    for(var i = 0; i < olElement.childNodes.length; i++){
        if(olElement.childNodes[i].nodeType == 1 ){
            var childOf = olElement.childNodes[i];
            for(var j = 0; j < childOf.childNodes.length; j++){
                if(childOf.childNodes[j].nodeType == 3 ){
                    console.log(childOf.childNodes[j].nodeValue);
                }
            }
        }
    }

    var oltags = document.getElementsByTagName("ol");
    for(var k = 0; k < oltags.childNodes.length; k++){
        if(oltags.childNodes[k].nodeType == 1 ){
            var childOf = oltags.childNodes[k];
            for(var l = 0; l < childOf.childNodes.length; l++){
                if(childOf.childNodes[l].nodeType == 3 ){
                    console.log(childOf.childNodes[l].nodeValue);
                }
            }
        }
    }


}
window.onload = getNodeValue;
</script>

HTML 如下：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Getting Node Values</title>
</head>
<body>
    <h1>Things To Do</h1>
    <ol id="toDoList">
        <li>Mow the lawn</li>
        <li>Clean the windows</li>
        <li>Answer emails</li>
        <li>Learn javascript</li>
        <li>Learn more javascript</li>
        <li>And learn even more!</li>
    </ol>

    <p id="toDoNotes">Make sure all are completed by 8pm so I can watch the game on TV!</p>
</body>
</html>

我在代码中对 getElementsByTagName 的使用是否不正确

var oltags = document.getElementsByTagName("ol");

不正确？如果不正确，为什么？或者是其他原因导致了这个问题？

后续问题：有没有比我在这里所做的更好的方法来访问元素内的文本节点？

Answer 1

为什么不直接使用标签名称？

var a = olElement.getElementsByTagName("li");

for(var i = 0; i < a.length; i++){
    if(a[i].nodeType == 1 ){

//etc

Answer 2

您应该使用 document.getElementById("idOfElement") ，然后迭代其子节点

Ricardo Brilhante

2016-09-21