-1

一组“dl”列表：

<div class = "container">
   <dl class = "list">
       <dt class = "title">title 1-1</dt>
       <dd class = "detail">detail 1-1</dd>

       <dt class = "title">title 1-2</dt>
       <dd class = "detail">detail 1-2</dd>
   </dl>
</div>

<div class = "container">
   <dl class = "list">
       <dt class = "title">title 2-1</dt>
       <dd class = "detail">detail 2-1</dd>

       <dt class = "title">title 2-2</dt>
       <dd class = "detail">detail 2-2</dd>
   </dl>
</div>

我需要访问“dt”标签中的所有标题。节点列表返回了两个节点，但是一旦我将它转换为一个数组，它在 console.log 中什么也没有显示。

var myContainer = document.getElementsByClassName('container');

for(var i=0; i<myContainer.length; i++) {
    var nodelist = myContainer[i].getElementsByTagName('dt');

    console.log(nodelist);   //returns HTMLcollection []
                             // 0 - dt.title
                             // 1 - dt.title

    var arr = Array.prototype.slice.call(nodelist, 0);

    console.log(arr);        //returns []
                             //there are no child objects.
}

这是为什么？

4

1 回答 1

-1

nodelist (HTMLCollection)不是数组。另请参阅为什么我不能在 NodeList 上使用 forEach 或 map？

NodeList 的使用与数组非常相似，并且很想在它们上使用 Array.prototype 方法。然而，这是不可能的。

访问它

for (var j = 0; j < nodelist.length; j++)
    console.log(nodelist[j].innerHTML);

JSFiddle

因为这也被标记为 

$('.container .title').each(function(index, title) {
    console.log($(title).text());
});

JSFiddle

更新：

我终于找到了罪魁祸首

在 for 循环末尾添加

var titles = arr.map(function(dt) { return dt.innerHTML; });
console.log(titles);

这显示了dt.title的文本

["title 1-1", "title 1-2"]
["title 2-1", "title 2-2"]

JSFiddle

于 2013-02-01T03:34:25.610 回答