分享

jQuery的遍历

 印度阿三17 2021-03-19

jQuery对象本身就是数组对象,通过jQuery选择器获得的都是满足该选择器条件的元素对象的集合体。因此常常需要对jQuery对象进行遍历。

1. 原始方式遍历

  • 语法
for(var i=0;i<元素数组.length;i  ){
  元素数组[i];
}
  • 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function() {
var $lis = $("#city li");
for (var i = 0; i < $lis.length; i  ) {
console.log($($lis[i]).html());
}
});
</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
<li>天津</li>
<li>重庆</li>
</ul>
</body>
</html>

2. jquery对象方法遍历

  • 语法
jquery对象.each(function(index,element){});

其中,
index:就是元素在集合中的索引
element:就是集合中的每一个元素对象
  • 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function() {
$("#city li").each(function(index, element){
//index, 就是元素在集合中的索引
//element,就是集合中的每一个dom元素对象
console.log(index  "==="  $(element).html());
});
});
</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
<li>天津</li>
<li>重庆</li>
</ul>
</body>
</html>

3. jquery的全局方法遍历

  • 语法
$.each(jquery对象,function(index,element){});

其中,
index:就是元素在集合中的索引
element:就是集合中的每一个元素对象
  • 代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
var $lis = $("#city li");
$.each($lis, function(index, element){
//index, 就是元素在集合中的索引
//element,就是集合中的每一个dom元素对象
console.log(index  "==="  $(element).html());
});
});
</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
<li>天津</li>
<li>重庆</li>
</ul>
</body>
</html>
来源:https://www./content-4-897201.html

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约