如何访问所有子<李>jquery中列表中的元素

How to access all child <li> elements in a list in jquery?

本文关键字：jquery gt 何访问 列表 元素 lt 访问      更新时间：2023-09-26

例如，我有一个html代码，如下所示：

<ul id="li1">
  <li>a</li>
  <li>b</li>
  <li>c</li>
  <li>d</li>
  <li>e</li>
  <li class="class1">f</li>
  <li>g</li>
</ul>

我想遍历每个<li>元素，并检查它是否有一个特定的类"class1"。我正在寻找看起来像(相当于python(的东西：

for i in $("#li1").children():
    print i.hasClass("class1")

我找不到一种方法来评估javascript或jquery中的每个子<li>元素。有人能帮忙吗？

不能将<li>直接嵌套在<li>下。那将是一个无效的加价。虽然，你可能有这样的东西：

<ul id="li1">
  <li>a</li>
  <li>b</li>
  <li>c</li>
  <li>d</li>
  <li>e</li>
  <li class="class1">f</li>
  <li>g</li>
</ul>

因此，对于上面的代码，要获得相同的输出，请使用以下方式：

$("#li1 li").each(function () {
  console.log($(this).hasClass("class1"));
});

这将打印：

false
false
false
false
false
true
false

在Praveen的基础上，您还可以使用以下内容来只循环使用那些具有类的li标记

$("#li1 li.class1").each(function () {
  console.log($(this).hasClass("class1"));
});

干杯

这看起来像是在询问如何在JavaScript中循环

这里有一种使用while的方法，它在具有falsy值的索引处停止(即undefined(

var i,                           // set up variables, 
    i_idx = 0,                   // initial index
    list = $("#li1").children(); // and interesting object
while (i = list[i++]) {
    console.log($(i).hasClass("class1"));
}

这里有一种使用for的方法，它通过在for 的比较表达式空间中做两件事来遍历所有标记

var list = $("#li1").children(); // interesting object
for (var i_idx = 0, i; i = list[i_idx], i_idx < list.length; ++i_idx) {
    console.log($(i).hasClass("class1"));
}

这里使用索引i = list[i_idx]设置i，然后使用逗号运算符在单个表达式中针对长度i_idx < list.length测试索引

请注意

  • jQuery对象的索引属性指向本机DOM对象，这就是为什么它们需要封装在$(...)中才能再次在jQuery中使用
  • while和for等不提供var作用域，变量i、i_idx、list由其父函数(或全局作用域(确定作用域
  • 在CCD_ 21或CCD_ 22的条件下生成CCD_。这通常是不希望的，这就是为什么它是提前CCD_ 23d
  • 有迭代Array的本地方法(.forEach、.map等(，jQuery也提供迭代方法，但如果你不知道这些方法来自哪里，你可能会意外地被发现(例如，类似的Array，如NodeList，并不总是提供这样的方法(

ES6

如果您在EMCAScript 6支持的环境中工作，您可以使用for..of，它的行为与python示例中的行为非常相似

for (let i of $("#li1").children()) {
    console.log($(i).hasClass("class1"));
}
相关文章：