-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」タグのすべてのタイトルにアクセスする必要があります。nodelist は 2 つのノードを返しましたが、それを配列に変換すると、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)配列ではありません。「ノードリストでforEachまたはマップを使用できないのはなぜですか？」も参照してください。

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 に答える