Question

我想要div文本下所有li元素的ID。

<div id="editSortable"> 
<ul class="sortable-list  ui-sortable">
    <li id="id1">Test 1</li>
    <li id="id2">Test 2</li>
    <li id="id3">Test 3</li>
</ul>
</div>

我需要输出id1，id2，id3作为字符串。

Answer 1

你可以用它。它会对你有用。

var ids = [];
$("#editSortable").find("li").each(function () { ids.push(this.id); });
var result = ids.join(",");

Answer 2

使用attr("id")获取每个li的ID
您需要使用.each()
您可以使用.map()将所有ID转换为数组

$('#editSortable').find('li').each(function() {
  console.log(this.id) //more efficient way to get id of an element
  //console.log($(this).attr("id"))//another way to get an id of element
})

var arr = $('#editSortable').find('li').map(function() {
  return ($(this).attr("id"))
}).get();

console.log(arr)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editSortable">
  <ul class="sortable-list  ui-sortable">
    <li id="id1">Test 1</li>
    <li id="id2">Test 2</li>
    <li id="id3">Test 3</li>
  </ul>
</div>

Answer 3

while 你需要输出为id1，id2，id3作为字符串 .. [方式]你可以使用.each()并通过+=保存ID将它们添加到除了最后一个之外用逗号连接的变量

<强>演示

var Ids= '';
$('#editSortable .sortable-list li').each(function(){
     var comma = $(this).index() + 1 == $('#editSortable .sortable-list li').length ? '' : ',';
     Ids += this.id + comma;
});

console.log(Ids)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editSortable"> 
    <ul class="sortable-list  ui-sortable">
        <li id="TEXT_1">Test 1</li>
        <li id="TEXT_2">Test 2</li>
        <li id="TEXT_3">Test 3</li>
    </ul>
</div>

Answer 4

通过这种方式轻松完成。

$("#editSortable ul li").each(function(){
  console.log($(this).attr("id"));
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="editSortable"> 
<ul class="sortable-list  ui-sortable">
    <li id="id1">Test 1</li>
    <li id="id2">Test 2</li>
    <li id="id3">Test 3</li>
</ul>
</div>

我如何阅读Ids＆＃39; li标签的div元素

4 个答案: