$.each():可用于遍历任何的集合(无论是数组或对象)

$(selector).each():专用于jquery对象的遍历,

如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但javascript总会包装this 值作为一个对象—尽管是一个字符串或是一个数字),方法会返回被遍历对象的第一参数.

each的几种常用的用法

①一维数组:var arr1 = [ "aaa", "bbb", "ccc" ];

$.each(arr1, function(i,val){
alert(i);
alert(val);
});
alert(i)将输出0,1,2
alert(val)将输出aaa,bbb,ccc

②一维数组:var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]

$.each(arr2, function(i, item){
alert(i);
alert(item);
});
//arr2为一个二维数组,item相当于取这二维数组中的每一个数组。
//item[0]相对于取每一个一维数组里的第一个值
alert(i)将输出为0,1,2,因为这二维数组含有3个数组元素
alert(item)将输出为 ['a', 'aa', 'aaa'],['b', 'bb', 'bbb'],['c', 'cc', 'ccc']
$.each(arr, function(i, item){
  $.each(item,function(j,val){
     alert(j);
    alert(val);
 });
});
alert(j)将输出为0,1,2,0,1,2,0,1,2
//将会输出每个数组的每个值
alert(val)将输出为a,aa,aaa,b,bb,bbb,c,cc,ccc

实例:动态生成树

后台返回的是一个二维数组

<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-content">
<ul class="nav" id="menus"> </ul>
<span id="liMsg"></span>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
jQuery.ajax({
type:'POST',
url: '/ZAdmin/MenuHandler.ashx',
data: {action:'rootMenu'},
dataType:'json',
success: function (data) {
if (data.Status == 200) {
var htmlLi = "";
$.each(data.Data, function (i, item) {
htmlLi +='<li>';
$.each(item, function (j, val) {
if (j == 'menu_name') {
htmlLi+='<a>' + val + '</a>';
}
});
htmlLi+='</li>';
$('#menus').html(htmlLi);
});
} else {
$('#liMsg').text('异常');
}
},
error: function (errorThrown) {
jQuery('#liMessage').val('网络通讯异常');
return false;
}
})
});
</script>

这块遇到一个问题,由于我是动态拼数据,当我用append()时,不能追加到临时变量上,试了很多方法,转成jquery对象也不行

后来只能把动态生成的数据写在临时变量中然后用html()往里插入

jquery中$each()的更多相关文章

  1. jQuery中的end()

    要说end(),我们就不得不说prevObject. 在jQuery中,每个jQuery对象都有一个prevObject属性 var $p = $('p'); 这个属性是做什么的呢? jQuery内部 ...

  2. jquery中的get和set

    jquery中通过参数的个数来判断是get方法还是set方法: css: function(name, value ) { return value !== undefined ? jQuery.st ...

  3. jQuery基础之(二)jQuery中的$

    在jQuery中,最常用的莫过于使用美元符号$,它提供了各种各样的丰富功能.包括选择页面中一个或者一类元素.作为功能函数的前缀.windows.onload的完善,创建DOM节点等.本文介绍jQuer ...

  4. jQuery中$.post()的使用

    $.post()方法是jquery本身对ajax的一个简单封装,其效果等价于: $.ajax({ url:url, type:"POST", data:data, dataType ...

  5. jQuery中的&& ||

    jQuery1.2.6 clean方法中有这么一段第一眼看去会让人晕掉的方法.完全不知其所言. “||, && 可以这样用?”,“这段东西最终返回的是个什么对象啊?” // Trim ...

  6. jquery 中的 this 和 $(this)

    this,表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性,方法 $(this),代表的上下文对象是一个jquery的上下文对象,可以调用jquery的方法和属性值. 亦即: ...

  7. Ajax跨域原理及JQuery中的实现

    浅析Ajax跨域原理及JQuery中的实现分析   AJAX 的出现使得网页可以通过在后台与服务器进行少量数据交换,实现网页的局部刷新.但是出于安全的考虑,ajax不允许跨域通信.如果尝试从不同的域请 ...

  8. jquery 中 this 的范围

    jquery 中的 this button 通常会存在  onclick;// input[type='file'] 会存在 onchange 事件 eg:  onclick = " del ...

  9. 【从0到1学jQuery】jQuery中each()和$.each()的使用

    引子: 最近遇到一个问题,就是在each()函数中怎么模拟for循环中的break和continue的操作.所以就查看了jQuery关于这个函数的文档,并且总结一下. 演示代码如下: <div& ...

  10. JSONP原理及jQuery中的使用

    JSONP原理   JSON和JSONP   JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,用于在浏览器和服务器之间交换信息.   JSONP(JSON ...

随机推荐

  1. Android高效加载大图

    通过BitmapFactory的decode方法设置特定的options缩小图片到指定尺寸 1:通过加载设置了只编码图片边界options的图片,获取原图的尺寸和类型 2:计算图片需要缩小的倍数 3: ...

  2. 1 ERP管理系统概念

    1 ERP管理系统概念 一.ERP是什么? ERP是企业资源计划(Enterpise Resource Planning)的简称,蕴含现代企业管理理念,其核心是在制造资源计划基础上进一步发展而成的面向 ...

  3. SpringMVC(五)@RequestHeader和@CookieValue

    通过使用@RequestHeader获取请求头 通过使用@CookieValue获取cookie值 代码: 1: @Controller 2: public class TestHeader_Cook ...

  4. mysql出错ERROR 2003 (HY000): Can't connect to MySQL server on 'localhost' (10061)

    其他的贴会教你 1.键盘上win+r 2.输入cmd 3.输入net  start mysql 但是还是没用 你可以试试 1.右击开始菜单 2.点击windows PowerShell(i) 3.输入 ...

  5. 很详尽KMP算法(厉害)

    作者:July时间:最初写于2011年12月,2014年7月21日晚10点 全部删除重写成此文,随后的半个多月不断反复改进.后收录于新书<编程之法:面试和算法心得>第4.4节中. 1. 引 ...

  6. Windows自调试Redis

    一.安装Redis 1. Redis官网下载地址:http://redis.io/download,下载相应版本的Redis,在运行中输入cmd,然后把目录指向解压的Redis目录. 2.启动服务命令 ...

  7. webstorm + babel

    网上有很多关于如何设置babel的.我学习着设置,但总差那么几步,没能满足我的需求. 我使用的是webStorm2017.1版本. babel安装准备 使用webStorm自带的filewatcher ...

  8. C#通过SendMessage发送消息,改变其他程序的下拉框控件(ComboBox)的值

    IntPtr cbh= new IntPtr(handle); //ComboBox的句柄 SendMessage(cbh, 0x014D, new IntPtr(-1), "需要选中的下拉 ...

  9. Elasticsearch 入门 - Exploring Your Cluster

    The REST API Cluster Health ( http://localhost:9200/ ) curl -X GET "localhost:9200/_cat/health? ...

  10. oracle 创建自增主键

    1.创建表 create table Test_Increase( userid number(10) NOT NULL primary key, /*主键,自动增加*/ username varch ...