Question

我有这个HTML：

<ul id="sortable" >
    <li class="myclass" id="1">One item</li>
    <li class="myclass" id="3">Another item</li>
</ul>

此列表更改不是静态的。所以ids可以改变。如何从此列表中获取所有ID（值）？

Answer 1

您可以使用map()并返回ID数组

＆＃13;

var ids = $('#sortable li').map(function() {
  return $(this).attr('id');
}).get();

console.log(ids)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="sortable">
  <li class="myclass" id="1">One item</li>
  <li class="myclass" id="3">Another item</li>
</ul>

＆＃13;

Answer 2

$( ".myclass" ).each(function( ){
   var id = $(this).attr('id');
   // this will return id
});

Answer 3

您可以遍历所有li标记，并将其ID转换为数组。

 var arrayOfIds = [];

 $('#sortable li').each(function(){
   arrayOfIds.push($(this).attr('id'));
});

console.log(arrayOfIds);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="sortable" >
    <li class="myclass" id="1">One item</li>
    <li class="myclass" id="3">Another item</li>
   <li class="myclass" id="4">Yet Another item</li>
   <li class="myclass" id="5">And Another item</li>
</ul>

Answer 4

var IDs = [];
$("#sortable").find("li").each(function(){ IDs.push(this.id); });

console.log(IDs);

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<ul id="sortable" >
    <li class="myclass" id="1">One item</li>
    <li class="myclass" id="3">Another item</li>
</ul>
</body>
</html>

从列表中获取所有ID

4 个答案: