jQuery里each方法使用案例

这次给大家带来jQuery里each方法使用案例,jQuery里each方法使用的注意事项有哪些,下面就是实战案例,一起来看一下。

概述:

  each() 方法规定为每个匹配元素规定运行的函数。

  返回 false 可用于及早停止循环,相当于break。

  返回 true 可以结束本次循环,相当于continue。

语法:

$(selector).each(function(index,element){ })    index - 选择器的 index 位置    element - 当前的元素(也可使用 "this" 选择器)  $(selector).each(function(){ })  $.each(array,function(Key,Value){ })

登录后复制

1.遍历js数组

$(function(){ var array=["aaa","bbb","ccc"]; $.each(array,function(i,j){  alert(i+":"+j);  //i表示索引,j代表值 });})

登录后复制

2.遍历Object对象

var obj = new Object();obj.name="zs";$.each(obj, function(name, value) {  alert(this);  //this指向当前属性的值,等价于value  alert(name);  //name表示Object当前属性的名称  alert(value);  //value表示Object当前属性的值});

登录后复制

3.遍历JSON对象

var json ={"name":"zhangSan","role":"student"};$.each(json,function(key,value){ alert(key+":"+value);});

登录后复制

4.遍历由多个JSON对象组成的数组

var json =[{"name":"Amy","role":"student"},{"name":"Tom","role":"student"}];$.each(json, function(index, value) {  alert("index="+index+"" +"name:"+value.name+""+"role:"+value.role+"");});

登录后复制

 5.遍历jQuery对象 

      遍历jQuery对象       $(function(){    $("input[type='button']").bind("click",function(){     $("li").each(function(){      alert($(this).text())      });    });   });        
  • first
  • second

登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

jQuery替换节点元素步骤详解

Servlet3.0与JS通过Ajax交互实例详解

以上就是jQuery里each方法使用案例的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2762899.html

(0)
上一篇 2025年3月8日 10:03:20
下一篇 2025年3月8日 10:03:25

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • jquery拖动文件上传加载添加进度条

    这次给大家带来jquery拖动文件上传加载添加进度条,jquery拖动文件上传加载添加进度条的注意事项有哪些,下面就是实战案例,一起来看一下。 //进度条 0% //要拖动到的地方 登录后复制 js: var dz = $(‘#main_c…

    编程技术 2025年3月8日
    000
  • vue实现全选反选功能案例详解

    这次给大家带来vue实现全选反选功能案例详解,vue实现全选反选功能的注意事项有哪些,下面就是实战案例,一起来看一下。 全选功能可以说是前端开发中非常常见的一个功能,以前的项目开发用jQuery开发比较多。最近在使用vue前端框架重构之前的…

    2025年3月8日
    200
  • jQuery实现上传之前本地预览图片

    这次给大家带来jQuery实现上传之前本地预览图片,jQuery实现上传之前本地预览图片的注意事项有哪些,下面就是实战案例,一起来看一下。 www.jb51.net jquery上传图片本地预览效果$(‘#upload’).change(f…

    2025年3月8日
    200
  • jquery判断元素内容是否存在

    这次给大家带来jquery判断元素内容是否存在,jquery判断元素内容是否存在的注意事项有哪些,下面就是实战案例,一起来看一下。 input 用val(); var value = $(‘#test’).val()…

    2025年3月8日 编程技术
    200
  • jQuery做出循环时间自动更换样式功能

    这次给大家带来jQuery做出循环时间自动更换样式功能,jQuery做出循环时间自动更换样式的注意事项有哪些,下面就是实战案例,一起来看一下。 js核心代码部分: $(document).ready(function(){ // 皮肤列表选…

    编程技术 2025年3月8日
    200
  • jquery实现元素平面移动

    这次给大家带来jquery实现元素平面移动,jquery实现元素平面移动的注意事项有哪些,下面就是实战案例,一起来看一下。 最近再做报表时候,直接把全部字段都导出了,但这不太灵活。回忆老师讲过的项目做报表如下左右上下移功能灵活控制,所以就尝…

    2025年3月8日
    200
  • jQuery遍历XML节点与属性实现步骤

    这次给大家带来jQuery遍历XML节点与属性实现步骤,jQuery遍历XML节点与属性的注意事项有哪些,下面就是实战案例,一起来看一下。 研究了一下, 好像jquery没有attributes. 还是要借助于原生态的JS 以下是JS代码 …

    编程技术 2025年3月8日
    200
  • jQuery实现电子时钟功能步骤详解

    这次给大家带来jQuery实现电子时钟功能步骤详解,jQuery实现电子时钟功能的注意事项有哪些,下面就是实战案例,一起来看一下。 jQuery电子时钟 haha window.onload = function(){ showTime()…

    2025年3月8日
    200
  • Vue组件使用案例详解

    这次给大家带来Vue组件使用案例详解,Vue组件使用的注意事项有哪些,下面就是实战案例,一起来看一下。 Vue实例 项目启动过程 看一下现在我们的项目,想想整个项目的启动过程是什么(以直接打开index.html的方法访问为例来说明)? 你…

    编程技术 2025年3月8日
    200
  • jQuery实现鼠标滑过商品小图片上显示对应大图商品页预览功能

    这次给大家带来jQuery实现鼠标滑过商品小图片上显示对应大图商品页预览功能,jQuery实现鼠标滑过商品小图片上显示对应大图商品页预览功能的注意事项有哪些,下面就是实战案例,一起来看一下。 1 . 效果截图 2 . 代码 jQuery图片…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论