原文:https://www.cnblogs.com/zhaixr/p/7069857.html

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取值的更多相关文章

  1. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  2. JQuery TextArea的取值与赋值问题---(textarea中回车清空问题)——个人转载整理

    JQuery TextArea的取值与赋值问题---(textarea中回车清空问题) JQuery TextArea的取值与赋值问题 首先,说明这不是一个简单的问题! 先说取值: $("# ...

  3. jquery操作select(取值,设置选中)

    最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...

  4. 关于Jquery 操作Cookie 取值错误

    使用JQuery操作cookie时 发生取的值不正确的问题: 结果发现cookie有四个不同的属性: 名称,内容,域,路径 $.cookie('the_cookie'); // 读取 cookie $ ...

  5. Jquery操作Cookie取值错误的解决方法

    使用JQuery操作cookie时 发生取的值不正确,结果发现cookie有四个不同的属性,分享下错误的原因及解决方法. 使用JQuery操作cookie时 发生取的值不正确的问题:  结果发现coo ...

  6. jquery操作select取值赋值与设置选中[转]

    本节内容:jquery实现select下拉框的取值与赋值,设置选中的方法大全. 比如<select class="selector"></select> 1 ...

  7. jquery操作select(取值,设置选中) 基础

    每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selector"></select&g ...

  8. jQuery radio的取值与赋值

    取值: $("input[name='radioName']:checked").val(); 赋值: $("input[name='radioName'][value= ...

  9. jQuery循环遍历取值

    1:循环遍历取值 var arr = new Array(); $(".plus-tag a span").each(function(i) { arr[i] = $(this). ...

  10. 用javascript/jQuery给CKEditor取值/赋值

    CKEditor 是著名的 HTML 编辑器,IBM.Oracle.Adobe 等都在用.CKEditor 创建于 2003 年,其前身为 FCKEditor,在 2009 年的时候把“F”去掉了,更 ...

随机推荐

  1. RESTful相关信息整理

    RESTful相关信息整理 参考:可以看的出来我是阮一峰的忠实读者 阮一峰的<理解RESTful架构> https://www.ruanyifeng.com/blog/2011/09/re ...

  2. 带你动手做AI版的垃圾分类

    摘要:本案例将使用YOLOX模型,实现一个简单的垃圾分类应用. 本文分享自华为云社区<ModelBox社区案例 - 使用YOLOX做垃圾分类>,作者:HWCloudAI. 1 ModelB ...

  3. Snipaste下载安装(使用教程)

    ## Snipaste下载安装(使用教程)**一 简单介绍** Snipaste 是一个免费简单但强大的截图工具,也可以让你将截图贴回到屏幕上!下载并打开 Snipaste,按下 F1 来开始截图,再 ...

  4. vim编辑器操作指南

    编辑模式(i) yy复制行 p粘贴 dd剪切 V按行选中 u撤销 ctr+r反撤销 >>往右缩进 <<往左缩进 :/...搜索指定内容 .重复上一次命令 G回到最后一行 gg回 ...

  5. LAMP环境搭建——最详细的手工编译

    环境:阿里云服务器ECS,Alibaba Cloud Linux 3.2104 LTS 64位 ,2核(vCPU) 2 GiB LAMP 是搭建Web应用时最常用的环境,LAMP 分别表示 Linux ...

  6. Fastjson Sec

    Fastjson 前置知识 autoType功能 序列化:fastjson在通过JSON.toJSONString()将对象转换为字符串的时候,当使用SerializerFeature.WriteCl ...

  7. 代码随想录算法训练营day18 | leetcode 513.找树左下角的值 ● 112. 路径总和 113.路径总和ii ● 106.从中序与后序遍历序列构造二叉树

    LeetCode 513.找树左下角的值 分析1.0 二叉树的 最底层 最左边 节点的值,层序遍历获取最后一层首个节点值,记录每一层的首个节点,当没有下一层时,返回这个节点 class Solutio ...

  8. .NET静态代码织入——肉夹馍(Rougamo) 发布1.4.0

    肉夹馍(https://github.com/inversionhourglass/Rougamo)通过静态代码织入方式实现AOP的组件,其主要特点是在编译时完成AOP代码织入,相比动态代理可以减少应 ...

  9. DOM04~

    事件对象及属性 事件对象 事件流 事件委托 综合案例 事件对象 获取事件对象 事件对象常用属性 什么是事件对象? 1.1 也是个对象,这个对象里有事件触发时的相关信息 1.2 例如鼠标点击事件中,事件 ...

  10. Solidity8.0-02

    对应崔棉大师 26-40课程https://www.bilibili.com/video/BV1yS4y1N7yu/?spm_id_from=333.788&vd_source=c81b130 ...