jQuery 遍历each()的使用方法
.each()是一个for循环的包装迭代器
.each()通过回调的方式处理,并且会有2个固定的实参,索引与元素(从0开始计数)
.each()回调方法中的this指向当前迭代的dom元素 遍历方法:
<div class="left first-div">
<div class="div">
<ul>
<li>111111111111</li>
<li>22222222222</li>
<li>3333333333</li>
</ul>
</div>
<div class="div">
<ul>
<li>4444444444</li>
<li>555555555</li>
<li>666666666</li>
</ul>
</div>
</div> <br/>
<button class="click">遍历元素</button>
<style>
.left {
width: auto;
height: 150px;
} .left div {
width: 150px;
height: 120px;
padding: 5px;
margin: 5px;
float: left;
background: #bbffaa;
border: 1px solid #ccc;
}
</style>
<script type="text/javascript">
$(".click").click(function() {
$("li").each(function(index, element) { //遍历所有的li
$(this).css('color','red') //修改每个li内的字体颜色
})
})
</script>
效果图:
回调函数方法: div和样式跟之前遍历的一样
<button class="click">回调判断</button>
<script type="text/javascript">
$(".click").click(function() {
$("li").each(function(index, element) { //遍历所有的li
if (index % 2) { //修改偶数li内的字体颜色
$(this).css('color','blue')
}
})
})
</script>
效果图:
jQuery 遍历each()的使用方法的更多相关文章
- jquery遍历json与数组方法总结
来自:http://www.php100.com/html/program/jquery/2013/0905/5927.html 先我们来参考each() 方法,each()规定为每个匹配元素规定运行 ...
- Jquery 遍历数组之$().each方法与$.each()方法介绍
$().each() 对于这个方法,在dom处理上用的比较多,如果一个html页面上面有多个checkbox,这时用$().each来处理checkbox是比较不错的; $("input[t ...
- jQuery 遍历 - eq() 和siblings() 方法
eq() 方法将匹配元素集缩减值指定 index 上的一个. 通过为 index 为 2 的 div 加入适当的类.将其变为蓝色: <!DOCTYPE html> <html> ...
- Jquery遍历数组之$.inArray()方法介绍
$.inArray()函数用于在数组中搜索指定的值,并返回其索引值.如果数组中不存在该值,则返回-1; $.inArray(value,array) --value是要查找的值,array是被查 ...
- Jquery 遍历数组之grep()方法介绍
grep()方法用于数组元素过滤筛选. grep(array,callback,boolean);方法参数介绍. array ---待处理数组 callback ---这个回调函数用来处理数组中 ...
- jQuery遍历 filter()方法
实例 改变所有 div 的颜色,然后向类名为 "middle" 的类添加边框: $("div").css("background", &qu ...
- jQuery 遍历用法
jQuery 遍历 DOM 树 parent() 方法返回被选元素的直接父元素(找爸爸). parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (找长辈). parents ...
- 常用的jquery遍历函数
1.Jquery遍历祖先 1).parent() 方法返回被选元素的直接父元素. 2).parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>) ...
- 【转】 jquery遍历json数组方法
$(function () { var tbody = ""; //------------遍历对象 .each的使用------------- //对象语法JSON数据格式(当服 ...
随机推荐
- sql server Geometry 类型操作 笔记
sqlGeometry 类型为sql server 2008之后的版本 新加的一种CLR扩展数据类型,为广大sql server开发人员存储几何类型及空间运算提供极大的便利,下面说明geometry类 ...
- LeetCode 101. Symmetric Tree
Given a binary tree, check whether it is a mirror of itself (ie, symmetric around its center). For e ...
- spring Integration服务总线
最新项目中使用数据交换平台,主要通过交换平台抓取HIS数据库医生医嘱检查检验等数据以及FTP上的txt文件,html等病程文件,生成XML文件,之后通过业务系统按业务规则对数据进行处理,再将其存入数据 ...
- 翻译:深入 AngularUI Router
原文地址:http://www.ng-newsletter.com/posts/angular-ui-router.html ui-router: https://angular-ui.github. ...
- DP三角形
Hrbust1038 http://acm.hrbust.edu.cn/index.php?m=ProblemSet&a=showProblem&problem_id=1038 // ...
- MAC 下用GCC编译报错:“Undefined symbols for architecture x86_64: ”
解决方法: 因为GCC编译的时候没有链接C++ standard library, 因此在编译的时候要加入符号 -lstdc++ 使用命令: gcc myprog.c -o myprog -lstdc ...
- 网站图片优化-解码JPEG
首先,老大拿了两个网站工具的分析跟我说,让我分析一下我们网站的图片有没有什么方法优化. [网站分析工具]webpage test: http://www.webpagetest.org/谷歌pages ...
- 解决数据标准及质量AppScan(测试)安全性问题相关方法
1. SQL注入文件写入(需要用户验证) 解决办法:通过建立过滤器方法,对所有用户输入信息进行清理过滤.通过清理过滤用户输入所包含的危险字符,便可能防止恶意的用户导致应用程序执行计划外的任务,例如:启 ...
- COM 学习(五)——编译、注册、调用
"最小依赖",表示编译器会把 ATL 中必须使用的一些函数静态连接到目标程序中.这样目标文件尺寸会稍大,但独立性更强,安装方便:反之系统执行的时候需要有 ATL.DLL 文件的支持 ...
- php最简单的文件处理。
<?php $DOCUMENT_ROOT =$_SERVER['DOCUMENT_ROOT']; ?> <html> <head> <title>Bob ...