最近一直在研究JS,今天看到遍历模块的时候,看到了这个函数:

$(selector).each(function(index,element))

但是想想,这个函数和之前项目里面用到的遍历数据的函数不是同一个呀(项目里面用到的函数:$.each(dataresource,function(index,element))),于是,就好好研究了下,果然在JS里面有两个相似的函数,于是也就有了今天的主题:

1.$(selector).each(function(index,element))

  

2.$.each(dataresource,function(index,element))

  接下来就对这两个函数做深入的探讨:

1.$(selector).each(function(index,element))

作用:在dom处理上面用的较多

示例:

html部分文档

<ul id="each_id">
<li>Coffee</li>
<li>Soda</li>
<li>Milk</li>
</ul>

js遍历函数:

function traversalDOM(){
$("#each_id li").each(function(){
      alert($(this).text())
    });
}

输出结果:

2.$.each(dataresource,function(index,element))

作用:在数据处理上用的比较多,主要还是用来处理后台传到前端的数据的

示例:

此处没有html代码,只有js代码,如下:

function traversalData(){
var jsonResourceList = '[{"id":"1","tagName":"apple"},{"id":"2","tagName":"orange"}]';
if(jsonResourceList.length >0){
$.each(JSON.parse(jsonResourceList), function(index, obj) {
    alert(obj.tagName);
});
}
}

输出结果:

3.最终结论:

在遍历DOM时,通常用$(selector).each(function(index,element))函数;

在遍历数据时,通常用$.each(dataresource,function(index,element))函数。

JQuery中的$().each 以及 $.each的区别的更多相关文章

  1. jQuery中的bind() live() delegate()之间区别分析

    jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...

  2. 深入理解jQuery中live与bind方法的区别

    本篇文章主要是对jQuery中live与bind方法的区别进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助 注意如果是通过jq添加的层和对象一定要用live(),用其他的都不起作用 ...

  3. jQuery中attr和prop方法的区别说明

    jquery中attr和prop的基本区别可以理解为:如果是内置属性,建议用prop,如果是自定义的建议用attr. 例如 <input type=check  node=123 id=ck & ...

  4. jquery中的$().each和$.each的区别

    jquery中的$().each和$.each的区别 注意:jquery中的$().each和$.each的区别,前者只能遍历数组,后者可以遍历数组和对象 备注:sinobook项目中地名本体相关地按 ...

  5. jQuery中attr和prop方法的区别

    jQuery中attr和prop方法的区别。 http://my.oschina.net/bosscheng/blog/125833 http://www.javascript100.com/?p=8 ...

  6. jquery中的this与$(this)的区别总结(this:html元素)($(this):JQuery对象)

    jquery中的this与$(this)的区别总结(this:html元素)($(this):JQuery对象) 一.总结 1.this所指的是html 元素,有html的属性,可用 this.属性  ...

  7. jquery中this与$(this)的用法区别

    jquery中this与$(this)的用法区别.先看以下代码: $("#textbox").hover( function() { this.title = "Test ...

  8. jquery 中 html与text函数的区别

    jquery 中 html与text函数的区别 共同点:它们都能讲函数中的参数渲染到页面中: 异同点: text() 只是简单的讲参数的内容写入到页面中: html() 会根据参数的值,判断是否字体符 ...

  9. 前端开发入门到进阶附录一【JQuery中parent(),parents(),parentsUntil()区别和使用技巧】

    JQuery中parent(),parents(),parentsUntil()区别和使用技巧:https://blog.csdn.net/china1223/article/details/5193 ...

  10. JQuery中$.each 和$(selector).each()的区别详解

    PS:晚上在写页面时,发现了一个问题,$.each 和$(selector).each()有哪些区别?百度搜索关键词,首页显示出来一些前人的经验,总结一下,发上来. 1.$(selector).eac ...

随机推荐

  1. PySpider安装与使用(Windows系统下)

    PySpider Begin 安装pip install pyspider 在windows系统好像会出现如下问题 Command "python setup.py egg_info&quo ...

  2. ubuntu搭建mysql

    步骤1 – 安装MySQL 在 Ubuntu 16.04 中,默认情况下,只有最新版本的 MySQL 包含在 APT 软件包存储库中.在撰写本文时,那是 MySQL 5.7 要安装它,只需更新服务器上 ...

  3. Android Weekly Notes Issue #240

    Android Weekly Issue #240 January 15th, 2017 Android Weekly Issue #240 Hello, 各位亲, 从本篇笔记开始, 以后并不包含An ...

  4. Redis雪崩效应以及解决方案

    缓存雪崩产生的原因 缓存雪崩通俗简单的理解就是:由于原有缓存失效(或者数据未加载到缓存中),新缓存未到期间(缓存正常从Redis中获取,如下图)所有原本应该访问缓存的请求都去查询数据库了,而对数据库C ...

  5. html5--5-16 综合实例绘制饼图

    html5--5-16 综合实例绘制饼图 实例 <!doctype html> <html> <head> <meta charset="utf-8 ...

  6. html5--5-9 绘制扇形

    html5--5-9 绘制扇形 学习要点 综合运用已经学过的知识绘制一个扇形 矩形的绘制方法 rect(x,y,w,h)创建一个矩形 strokeRect(x,y,w,hx,y,w,h) 绘制矩形(无 ...

  7. js 分享代码--完整示例代码

    <div class="bdsharebuttonbox" data-tag="share_1"> <a class="bds_ms ...

  8. Rsync+Sersync同步

    Rsync+Sersync同步特点: (1):sersync可以记录下被监听目录中发生变化的(包括增加.删除.修改)具体某一个文件或某一个目录的名字:(2):rsync在同步的时候,只同步发生变化的这 ...

  9. some characters cannot be mapped using iso-8859-1 character encoding

    Eclipse中新建一个.properties文件,如果输入中文保存时就会提示错误 Reason:some characters cannot be mapped using "ISO-88 ...

  10. 表单提交Post方法、Get方法

     表单用来接受用户的输入,并将用户的输入以“name=value值对”集合的形式提交到服务器进行处理.那么表单是怎样将数据提交到服务器的?服务器是怎样对表单数据进行处理的?下面我将为大家揭开表单提交背 ...