jQuery中$.each()方法(遍历)
$.each()是对数组,json和dom结构等的遍历,说一下他的使用方法吧。
1、遍历一维数组
var arr1=['aa','bb','cc','dd'];
$.each(arr1,function(i,val){ //两个参数,第一个参数表示遍历的数组的下标,第二个参数表示下标对应的值
console.log(i+'```````'+val);
输出的结果为:
0```````aa
1```````bb
2```````cc
3```````dd
2、遍历二维数组
var arr2=[['aaa','bbb'],['ccc','ddd'],['eee','fff']];
$.each(arr2,function(i,item){ //两个参数,第一个参数表示下标,第二个参数表示一维数组中的每一个数组
console.log(i+'````'+item);
输出的结果为:
0````aaa,bbb
1````ccc,ddd
2````eee,fff
此时可以对输出的一维数组进行遍历
$.each(item,function(i,val){ //遍历二维数组
console.log(i+'`````'+val);
})
输出的结果为:
0````aaa,bbb
0`````aaa
1`````bbb
1````ccc,ddd
0`````ccc
1`````ddd
2````eee,fff
0`````eee
1`````fff
3、处理json
var json1={key1:'a',key2:'b',key3:'c'};
$.each(json1,function(key,value){ //遍历键值对
console.log(key+'````'+value);
})
输出的结果为:
key1````a
key2````b
key3````c
4、当二位数组中有json对象时
var arr3=[{name:'n1',age:18},{name:'n2',age:20},{name:'n3',age:22}];
$.each(arr3,function(i,val){
console.log(i+'`````'+val);
//输出
/* 0`````[object Object] 1`````[object Object] i2`````[object Object]*/
console.log(val.name); //获取每一个json里面的name值
console.log(val["name"]);
$.each(val,function(key,val2){
console.log(key+'```'+val2);
})
});
5、处理dom元素
<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444"/>
$.each($('input:hidden'),function(i,val){
console.log(i+'````'+val);
/*0````[object HTMLInputElement]
1````[object HTMLInputElement]
2````[object HTMLInputElement]
3````[object HTMLInputElement]*/
console.log(val.name+'`````'+val.value);
/* aaa`````111
bbb`````222
ccc`````333
ddd`````444*/
})
以上就是$.each()最基本的使用了,
jQuery中还有另外一种写法来遍历元素
$("input:hidden").each(function(i,val){ //第一个参数表示索引下标,第二个参数表示当前索引元素
alert(i);
alert(val.name);
alert(val.value);
});
jQuery中$.each()方法(遍历)的更多相关文章
- js,jquery中.each()方法遍历如何终止循环
用.each()方法遍历节点的时候,用“return false”只能终止当前循环并跳入下一次循环,并不能终止所有循环.代码如下: $(".days").each(function ...
- jquery中.each()方法遍历循环如何终止方法
使用return false 终止循环 function checkStar(obj){ var flag=false; //获取本节点星级 var star = obj.getAttribute(& ...
- jQuery通用的全局遍历方法$.each()用法实例
1.jQuery通用的全局遍历方法$.each()用法 2. test.json文件代码: 3. html代码 4.jQuery代码 <script src="jquery-1.3.1 ...
- HTML 5 的自定义 data-* 属性和jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
- jquery 常用基础方法
1 jquery常用方法: 2 取得标签元素里面内容与修改: 3 1.text()方法: 4 $(document).ready(function(){ 5 //alert("文档加载完毕& ...
- jQuery基础之(二)jQuery中的$
在jQuery中,最常用的莫过于使用美元符号$,它提供了各种各样的丰富功能.包括选择页面中一个或者一类元素.作为功能函数的前缀.windows.onload的完善,创建DOM节点等.本文介绍jQuer ...
- Jquery源码中的Javascript基础知识(四)— jQuery.fn.init方法
$() 即调用了jQuery.fn.init方法 jQuery = function( selector, context ) { return new jQuery.fn.init( selecto ...
- html5的自定义data-*属性和jquery的data()方法的使用示例
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据. 但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它 ...
- html5的自定义data-*属性与jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
- html5的自定义data-*属性和jquery的data()方法的使用
人们总喜欢往HTML标签上添加自定义属性来存储和操作数据.但这样做的问题是,你不知道将来会不会有其它脚本把你的自定义属性给重置掉,此外,你这样做也会导致html语法上不符合Html规范,以及一些其它副 ...
随机推荐
- .net core入门-发布及部署_异常(处理程序“aspNetCore”在其模块列表中有一个错误模块“AspNetCoreModuleV2")处理
备注:本人使用开发工具:VS2017,.NET Core 2.2,其中VS2017原本自带2.1,我单独从官网下载了2.2的程序集安装包,但是没有下配套的运行环境,运行项目时出了一个问题. 以下是我在 ...
- 我的Spring Boot学习记录(一):自动配置的大致调用过程
1. 背景 Spring Boot通过包管理工具引入starter包就可以轻松使用,省去了配置的繁琐工作,这里简要的通过个人的理解说下Spring Boot启动过程中如何去自动加载配置. 本文中使用的 ...
- 008. 阻塞&非阻塞、同步&异步
阻塞 非阻塞:关注的对象是调用者: 阻塞:调用者发起调用后,处于等待状态,直到该调用有返回: 非阻塞:调用者发起调用后,不需要等待返回,可以往下执行: 同步 异步: 关注的对象是被调用者: 同步:服 ...
- informix存储过程笔记
一.存储过程概述 存储过程是一个用户定义的函数,由存储过程语句(SPL) 和一组SQL语句组成,以可以执行代码形式存储在数据库中,和表.视图.索引等一样,是数据库的一种对象. 存储过程语言SPL(St ...
- Dotspatial 空间要素选择
//通过遍历选择要素,获取选择要素相交的要素 private void toolStripButton43_Click(object sender, EventArgs e) { //查看与选中要素重 ...
- ArcPy 创建图层空间索引
使用Python脚本进行图层的空间索引的创建. 附上Python代码: # -*- coding: utf-8 -*- # nightroad import sys import arcpy relo ...
- Docker-Linux环境安装
不同服务器操作系统安装命令不同,例如centOS默认用yum,Ubuntu可能默认用apt-get.这里推荐一种安装方式,通过下载shell脚本 https://get.docker.com,会检测操 ...
- composer包(发布到github上)同步到Packagist
在上一篇文章里面,探讨了如何一步步建立composer包–创建你的一个composer包 创建完成后,我们需要做的就是讲自建的包发布到Packagist上.至于说什么是Packagist,这个就不用我 ...
- Carthage入门篇-安装和使用
在iOS开发过程中,用到最多的三方库管理工具也许是Cocoapods.Cocoapods会自动为你创建一个workspace,然后自动将你要用到的三方库集成到Project中,而整个过程,你只需要对P ...
- Linux命令大杂烩
查看linux出口IP curl ifconfig.me scp跨服务器转移文件命令 scp 文件 root@IP:/application/apache-tomcat-8.0.36 回车, ...