文档章节

Jq的$().each和$.each()的小区别

 奋斗的小鱼儿
发布于 2016/10/28 13:34
字数 333
阅读 38
收藏 0

最近一直在研究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"},{"id":"3","tagName":"banan a"},{"id":"4","tagName":"watermelon"}]';
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))函数。

好了,就到这里吧,希望可以帮助到大家!祝各位工作愉快!

本文转载自:http://blog.csdn.net/zjh_1110120/article/details/50550108

粉丝 0
博文 11
码字总数 1017
作品 0
宝坻
程序员
私信 提问
linux下json解析神器----jq

前言 在linux环境中,使用curl命令,调用单个接口,返回的数据通常都是一大坨,看起来很不方便。 如图: 如果我们只需要其中的一部分数据,name在这么一大坨中寻找,还是比较吃力的。 一般遇...

迈阿密小白
2018/09/21
0
0
jq动态生成标签后无法监听

如题所示,在做一个项目的时候碰到上述问题。 在网上查了一下jq绑定事件的方法,有四种,分别是live,delegate,bind和on方法。 但在jq1.7以下用on代替了live,delegate和bind方法,上述四种方法...

zdatbit
2016/06/14
43
0
jq的优缺点总结

第一部分 jq的优势: 1.出色的浏览器兼容性 2、出色的DOM操作的封装,使他具备强大的选择器,可以进行快速的DOM元素操作 3、可靠的事件处理机制、jq在处理事件绑定的时候是相当的可靠 4、完善...

oQo先生
2017/04/13
0
0
jq的优缺点总结

第一部分 jq的优势: 1.出色的浏览器兼容性 2、出色的DOM操作的封装,使他具备强大的选择器,可以进行快速的DOM元素操作 3、可靠的事件处理机制、jq在处理事件绑定的时候是相当的可靠 4、完善...

oQo先生
2017/04/12
0
0
Array & Event & Dom 兼容总结

Dom 元素节点 & 属性节点 & 文本节点 nodeName & tagName & nodeValue 测试代码 nodeName与tagName在浏览器中没有兼容问题,返回值是全大写。 下面是文本节点的属性 下面是元素节点 下面是文...

烽穹寒渊
2016/08/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

springboot 403 问题

添加WebAppConfigurer 配置 @Configuration@EnableAutoConfigurationpublic class WebAppConfigurer extends WebMvcConfigurerAdapter { public WebAppConfigurer() { } ......

布袋和尚_爱吃鱼
29分钟前
4
0
Python自动更换壁纸爬虫与tkinter结合

直接上代码 import ctypesimport timeimport requestsimport osfrom threading import Threadfrom tkinter import Tk, Label, Button,Entry,StringVar,messagebox# '放到AppData\Roami......

物种起源-达尔文
29分钟前
3
0
Postgresql Study 笔记

Postgresql 安装 Windows, MAC Install Postgresql 下载地址: https://www.enterprisedb.com/downloads/postgres-postgresql-downloads Linux Install sudo apt-get update sudo apt-get in......

slagga
31分钟前
4
0
layer.open 打开新页面传参问题

如图所示,点击出售,把A页面的数据传到弹框上面,因为弹框比较复杂,所以使用引入一个新页面。 A.html a.js B.html b.js 1、第一种方案 sellInte: function (){ var obj = document.g...

木九天
34分钟前
4
0
沙龙报名 | 区块链数据服务技术应用实践

京东云是国内首家提供区块链数据在线分析服务产品的公司,也是行业内首家对区块链数据服务进行开源的公司。 本次沙龙是京东云BDS开源后,首次在深圳举办线下沙龙,我们将邀请京东云BDS团队核...

京东云技术新知
35分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部