javascript - Javascript: 要素のリストを作成する最も簡単な方法

Question

div と、いくつかのアイテムを含むリストがあります。

<div id="myDiv">
<ul>
    <li><a>Item 1</a></li>
    <li><a>Item 2</a></li>
    <li><a>Item 3</a></li>
</ul>

アイテムの数が変わる可能性があることを知って、「a」要素のJavascript配列を簡単に作成するにはどうすればよいですか?

Answer 1

静的リストが必要な場合:

var mylist = $('#myDiv > ul > li > a').toArray();

---

しかし、あなたは「...アイテムの数が変わる可能性があることを知っている」と書いていました。これが、DOM の変更で更新される「ライブ リスト」が必要な場合は、次のようにします。

var mylivelist = document.getElementById("myDiv")
                         .getElementsByTagName("a");

このリストは、アイテムが追加または削除されると更新されます。<a>に他の要素がないと仮定し<div>ます。ある場合は、調整する必要があります。

Answer 2

普通の古い JavaScript の場合 (jQuery は必要ありません):

    var myDiv = document.getElementById('myDiv');
    var allAnchors = myDiv.getElementsByTagName('a');
    for (var i = 0; i < allAnchors.length; i++) {
        //do something with each allAnchors[i] node
        document.write(allAnchors[i].innerHTML + '<br />');
    }

Answer 3

jQueryを使用する場合は、

$('#myDiv a')

jQueryがない場合はこれだけ

document.getElementById('myDiv').getElementsByTagName('a')