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


Posted in jQuery onJanuary 18, 2019

$(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处理上面用的较多

<ul id="each_id">
    <li>muzi</li>
    <li>digbig</li>
    <li>muzidigbig</li>
  </ul>

js遍历函数:

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

输出结果:

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

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

作用:在数据处理上用的比较多

示例:

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

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

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

3.最终结论:

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

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

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

jQuery 相关文章推荐
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 jQuery
运用jQuery写的验证表单(实例讲解)
Jul 06 jQuery
jQuery制作全屏宽度固定高度轮播图(实例讲解)
Jul 08 jQuery
关于JS与jQuery中的文档加载问题
Aug 22 jQuery
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
详解jQuery中的isPlainObject()使用方法
Feb 27 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
jQuery实现模糊查询的方法分析
May 10 jQuery
jQuery实现获取选中复选框的值实例详解
Jun 28 jQuery
jQuery实现经典的网页3D轮播图封装功能【附源码下载】
Feb 15 jQuery
使用jquery-easyui的布局layout写后台管理页面的代码详解
Jun 19 jQuery
jquery实现异步文件上传ajaxfileupload.js
Oct 23 jQuery
jquery层次选择器的介绍
Jan 18 #jQuery
jQuery无冲突模式详解
Jan 17 #jQuery
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 #jQuery
Jquery获取radio选中值实例总结
Jan 17 #jQuery
jquery获取img的src值实例介绍
Jan 16 #jQuery
jQuery实现的点击图片居中放大缩小功能示例
Jan 16 #jQuery
jQuery+vue.js实现的多选下拉列表功能示例
Jan 15 #jQuery
You might like
最令PHP初学者们头痛的十四个问题
2007/01/15 PHP
PHP 获取远程文件内容的函数代码
2010/03/24 PHP
php读取excel文件示例分享(更新修改excel)
2014/02/27 PHP
PHP简单实现上一页下一页功能示例
2016/09/14 PHP
基于jquery的cookie的用法
2011/01/10 Javascript
js对象的比较
2011/02/26 Javascript
表单提交前触发函数返回true表单才会提交
2014/03/11 Javascript
JS实现的4种数字千位符格式化方法分享
2015/03/02 Javascript
JavaScript通过this变量快速找出用户选中radio按钮的方法
2015/03/23 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
使用Node.js给图片加水印的方法
2016/11/15 Javascript
Vue.js实战之通过监听滚动事件实现动态锚点
2017/04/04 Javascript
微信小程序动态的加载数据实例代码
2017/04/14 Javascript
react写一个select组件的实现代码
2019/04/03 Javascript
Angular4.0动画操作实例详解
2019/05/10 Javascript
swiper实现异形轮播效果
2019/11/28 Javascript
微信小程序indexOf的替换方法(推荐)
2020/01/14 Javascript
详解小程序横屏方案对比
2020/06/28 Javascript
mustache.js实现首页元件动态渲染的示例代码
2020/12/28 Javascript
JavaScript实现筛选数组
2021/03/02 Javascript
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
VTK与Python实现机械臂三维模型可视化详解
2017/12/13 Python
PYTHON基础-时间日期处理小结
2018/05/05 Python
用python爬取租房网站信息的代码
2018/12/14 Python
django框架模板语言使用方法详解
2019/07/18 Python
css3实现3D色子翻转特效
2014/12/23 HTML / CSS
中国海淘族值得信赖的海淘返利网站:55海淘
2017/01/16 全球购物
澳大利亚鞋仓库:Shoe Warehouse
2019/07/25 全球购物
写一个函数,求一个字符串的长度。在main函数中输入字符串,并输出其长度
2015/11/18 面试题
实习鉴定范文
2013/12/19 职场文书
总经理秘书工作职责
2013/12/26 职场文书
违反学校规则制度检讨书
2015/01/01 职场文书
2015年为民办实事工作总结
2015/05/26 职场文书
钱学森电影观后感
2015/06/04 职场文书
详解nginx进程锁的实现
2021/06/14 Servers
html+css实现环绕倒影加载特效
2021/07/07 HTML / CSS