举报投诉联系我们 手机版 热门标签 VUE中文网
您的位置:VUE中文网 > jquery遍历数组 jQuery 遍历 – 后代

jquery遍历数组 jQuery 遍历 – 后代

2023-04-05 02:17 jQuery教程

jquery遍历数组 jQuery 遍历 – 后代

jquery遍历数组

jQuery 是一个 JavaScript 库,它提供了一系列的方法来处理数组。jQuery 的遍历数组功能可以帮助我们快速地对数组中的每个元素进行操作,而不需要写很多的循环语句。

jQuery 中有三个函数可以用来遍历数组:each()、map() 和 grep()。

// each() 函数用于遍历数组中的每个元素:
$(array).each(function(index, element) { 
    // do something with element 
}); 

each() 函数会对 array 数组中的每个元素执行一次回调函数,回调函数有两个参数:index 和 element。index 是当前元素在 array 数组中的位置(从 0 开始计数);element 是当前正在处理的元素。

 
// map() 函数用于将 array 数组中的每个元素映射到新的值上: 
var newArray = $(array).map(function(index, element) { 
    return newValue; // 返回新值 
}); 

map() 函数会对 array 数组中的每个元素执行一次回调函数,并将回调函数返回值作为新值存储创建一个新的包含这些新值的文本字面量或者是 jQuery 对象。

  
// grep() 函數用于过滤 array 數字中不想要的元件:  
var newArray = $(array).grep(function(element, index) {   return condition; // 返回 true/false });   

grep() 函數会遍歷 array 數字中所有元件,如果回調函式返回 true ,則將當前元件添加利用這些文本字面量或者是 jQuery 物件創建一個斑包含這些斑値得斑本字面量或者是 jQuery 物件。

jQuery 遍历 – 后代

后代是子、孙、曾孙等等。

通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代。


向下遍历 DOM 树

下面是两个用于向下遍历 DOM 树的 jQuery 方法:

  • children()
  • find()

jQuery children() 方法

children() 方法返回被选元素的所有直接子元素。

该方法只会向下一级对 DOM 树进行遍历。

下面的例子返回每个 <div> 元素的所有直接子元素:

实例

$(document).ready(function(){
  $("div").children();
});

您也可以使用可选参数来过滤对子元素的搜索。

下面的例子返回类名为 "1" 的所有 <p> 元素,并且它们是 <div> 的直接子元素:

实例

$(document).ready(function(){
  $("div").children("p.1");
});

提示:在本站的jQuery编程实战中,你可以通过实践来练习:jQuery使用children()操作子级元素!



jQuery find() 方法

find() 方法返回被选元素的后代元素,一路向下直到最后一个后代。

下面的例子返回属于 <div> 后代的所有 <span> 元素:

实例

$(document).ready(function(){
  $("div").find("span");
});

下面的例子返回 <div> 的所有后代:

实例

$(document).ready(function(){
  $("div").find("*");
});


阅读全文
以上是VUE中文网为你收集整理的jquery遍历数组 jQuery 遍历 – 后代全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
© 2024 VUE中文网 vue88.com 版权所有 联系我们