$.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. SQL Server-数据库架构和对象、定义数据完整性

    前言 本节我们继续SQL之旅,本节我们如题来讲讲一些基本知识以及需要注意的地方,若有不妥之处,还望指出,简短的内容,深入的理解,Always to review the basics. 数据库架构和对 ...

  2. PowerDesigner 逆向工程 Could not Initialize JavaVM!

    原项目的大量的表,使用PowerDesigner 进行逆向工程.提示Could not Initialize JavaVM! 网上找到原因,PowerDesigner 不可以使用64位JDK环境! 有 ...

  3. npm一点点

    写在开头 要抓紧学习了,不然要遭... 月底之前有大量东西要学习,干 npm 包管理工具 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从NPM服务器下载并安装别人编写的命令行程序 ...

  4. React+Antd遇到的坑

    第一次尝试React+antd,发现果然不愧是传说中的坑货,一个又一个坑.必须要记录. react + antd,都是最新版本,使用npm和yarn各种add,build,start 1. 资源文件, ...

  5. JavaScript 创建对象之单例、工厂、构造函数模式

    01单例模式 首先看一个问题,我们要在程序中描述两个人,这两个人都有姓名和年龄,可能刚刚开始学习js的时候会写成这样: var name1 = 'iceman'; var age1 = 25; var ...

  6. 如何 打包整合linux系统文件夹 用于刷机包等等, 其中包括打包 句号开头 . 开头的文件, 排除系统文件 等

    tar --exclude=proc/*   --exclude=sys/* -cvjf rootfs.tar.bz2  * .[!.]* -R

  7. 【udacity】机器学习-决策树

    Evernote Export 1.监督学习 我们向系统中输出样本,并且告诉系统样本标签(target),系统用我们给出的不同样本的成功与失败的信息,构建它对成功或失败的因素的理解. 2.分类与回归之 ...

  8. Vue学习之路第十三篇:v-for指令

    v-for指令,看名字想必大家也能猜到其作用,没错,就是用来迭代.遍历的. 1.简单数组的遍历 <body> <divi id="app"> <spa ...

  9. mysql数据库增量恢复

    mysqldump -uroot -p -B discuzx -F -x --master-data=2 --events|gzip >/root/discuzx.sql.gz 写入数据 删除数 ...

  10. Anaconda安装tensorflow遇到的问题(转)

    tensorflow安装教程 1.找不到Anaconda Prompt 其他教程中说AnacondaPrompt在安装的Anaconda文件夹下面(如D:/Anaconda),但是我在安装中没有找到, ...