jquery - 如何使用 jquery 迭代 DOM ol 并将其 li 值保存到数组

Question

我想迭代 ol 并将所有 li 保存到数组中

<ol id="sortableAvailable">
  <li id="1"><a href="" >Foo 1</a></li>
  <li id="2"><a href="" >Foo 2</a></li>
  <li id="3"><a href="" >Foo 3</a></li>
  <li id="4"><a href="" >Foo 4</a></li>
</ol>

js应该是这样的：

var testInfoList = {};
testInfoList.ConfiguredTests = [];    


/* some iteration that do the following */
testInfoList.ConfiguredTests.push({
    ID: /*here i want the ID*/,
    Value: /*here i want the value*/
});

Answer 1

您可以使用.map：

testInfoList.ConfiguredTests = = $("#sortableAvailable li").map(function() {
    return { ID:this.id, Value:$(this).find("a").text() };
}).get();

map将遍历您的元素（选择查找li列表中的所有 s）并对每个元素应用一个函数。结果将是一个 jQuery 对象，可以使用.get().

我假设“值”是指链接中的文本；如果你想要别的东西，你可以从当前元素中提取它（this是 DOM 元素，$(this)将它包装在一个 jQuery 对象中）。

Answer 2

var myarray = [];    

$("ol li").each(function(){
    myarray.push({
                   ID: $(this).attr('id'),
                   Value: $(this).html()
                 });
});