jquery中的foreach数据的遍历
jquery中的foreach（即each）数据的遍历或者处理HTML页面元素的遍历使用方法讲解
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jquery each</title>
</head>
<body>
<div id="testDiv">
<ul>
<li data-id="1">1F</li>
<li data-id="2">2F</li>
<li data-id="3">3F</li>
<li data-id="4">4F</li>
<li data-id="5">5F</li>
</ul>
</div>
<!-- 引入jquery -->
<script src="/resources/framework/jquery/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(function(){
//1.$(selector).each(function(index){});
//$(selector).each();适合场景,对HTML页面的DOM元素进行操作
//例如下面将进行ul的li遍历取出所有data-id的值
var tmpStr1='';
$('#testDiv ul li').each(function(index){//index参数,索引
tmpStr1+=$(this).attr("data-id");//获取li中的data-id属性的值
tmpStr1+=',';//豆号分开，方便查看
});
alert("tmpStr1->:"+tmpStr1);
//2.$.each(arr,function(index,item){})
//$.each();适合对已知的元素数组进行遍历;
//适合场景ajax调用后台返回数据遍历值,或者已知数组,例如:
var arr=[1,2,3,9];
var tmpStr2='';
$.each(arr,function(index,item){//index,索引位置,item取出来的数组值
tmpStr2+=item;
tmpStr2+=',';
});
alert("tmpStr2->:"+tmpStr2);
//也可以先获取HTML页面的dom对象数组,然后遍历
var tmpStr3='';
var arrli=$('#testDiv ul li');
$.each(arrli,function(index,item){
tmpStr3+=$(item).attr("data-id");//获取li中的data-id属性的值
tmpStr3+=',';//豆号分开，方便查看
});
alert("tmpStr3->:"+tmpStr3);
//明显的$(selector).each()遍历HTML页面元素会写更少的代码
})
</script>
</body>
</html>运行HTML代码显示
https://blog.xqlee.com/article/5.html
评论
相关文章
jquery动态绑定事件处理一些由于html代码是动态生成，导致普通的$('selector') 绑定事件失败问题<!DOCTYPE html>l;<html>l;<h
jquery/j获取raido选中元素/选中值html<div id="testRaidoGroup">l;<input type="radio" name="te
尽管现在前端技术发展飞速发展，各种技术迭代很快，但jQuery还是在一些企业站或者简单网页尝尝用到，本文记录一下学写jQuery插件的内容，愿新手共勉，共同进步
jquery模拟点击事件写法//语法:$(selector).trigger("click");$('#test).trigger("click"); over
JavaScript/jquery选择同级兄弟节点选择上下级节点方法<script>l;function js_selector() {var s= documen
一、简介HTML5引入了 history.pushState() 和 history.replaceState() 方法，它们分别可以添加和修改历史记录条目。这
定义和用法animate() 方法执行 CSS 属性集的自定义动画。该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创
使用jQuery判断元素是否在可视区域 $("#app").offset().top; offset().top表示 绝对偏移值，比如说有一个很长的页面，#ap
layer.prompt弹出框设置默认值,layer.prompt弹出框如何默认值，偶尔需要给layer的弹出设置默认值这里详细讲解一下