JQuery查找子元素find()和遍历集合each的方法总结


Posted in Javascript onMarch 07, 2017

1.HTML代码

<div name="students" school="HK"> 
 <input type="boy" name="ZhangSan" value="206"> 
 <input type="girl" name="Lisi" value="108"> 
 </div>

 2.jquery

<script type="text/javascript"> 
 /* find() 查找子元素方法 */ 
 var aaa = $("div[name='students'][school='HK']").find("input[type='boy'][name='ZhangSan']"); 
 console.log(aaa.val()); 
  
 /* $(".child",parent); 方法查找子元素*/ 
 var bbb = $($("input[type='boy'][name='ZhangSan']"),$("div[name='students'][school='HK']")); 
 console.log(aaa.val()); 
 
 /* each()方法遍历数组 */ 
 var arr = [ "one", "two", "three", "four" ]; 
 $.each(arr, function() { 
  console.log(this); 
 }); 
  
 /* each()方法处理json */ 
 var obj = { 
  one : 1, 
  two : 2, 
  three : 3, 
  four : 4 
 }; 
 $.each(obj, function(key, val) { 
  console.log(obj[key]); 
 }); 
  
 /* each()方法处理二维数组 */ 
 var arr1 = [ [ 11, 44, 33 ], [ 4, 6, 6 ], [ 7, 20, 9 ] ] 
 $.each(arr1, function(i, item) { 
  console.log(item[0]); 
 }); 
 
 /* each()方法处理HTML元素 */ 
 $("div[name='students'][school='HK'] > input").each(function() { 
  console.log($(this).val()); 
 }); 
 </script>

以上这篇JQuery查找子元素find()和遍历集合each的方法总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery+CSS3实现一款简洁大气带滑动效果的弹出层
May 15 Javascript
图片动画横条广告带上下滚动的JS代码
Oct 25 Javascript
根据当前时间在jsp页面上显示上午或下午
Aug 18 Javascript
JS实现固定在右下角可展开收缩DIV层的方法
Feb 13 Javascript
js实现div拖动动画运行轨迹效果代码分享
Aug 27 Javascript
深入分析jsonp协议原理
Sep 26 Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
Apr 05 Javascript
JavaScript编写一个简易购物车功能
Sep 17 Javascript
jquery删除数组中重复元素
Dec 05 Javascript
webpack里使用jquery.mCustomScrollbar插件的方法
May 30 jQuery
vue实现简单的星级评分组件源码
Nov 16 Javascript
vue实现短信验证码登录功能(流程详解)
Dec 10 Javascript
AngularJS的Filter的示例详解
Mar 07 #Javascript
js上下视差滚动简单实现代码
Mar 07 #Javascript
js实现下一页页码效果
Mar 07 #Javascript
原生JS中slice()方法和splice()区别
Mar 06 #Javascript
浅析vue component 组件使用
Mar 06 #Javascript
js常用的继承--组合式继承
Mar 06 #Javascript
VUE开发一个图片轮播的组件示例代码
Mar 06 #Javascript
You might like
dedecms模板标签代码官方参考
2007/03/17 PHP
PHP 在线翻译函数代码
2009/05/07 PHP
php开发环境配置记录
2011/01/14 PHP
基于PHP代码实现中奖概率算法可用于刮刮卡、大转盘等抽奖算法
2015/12/20 PHP
PHP在线打包下载功能示例
2016/10/15 PHP
php实现商城购物车的思路和源码分析
2020/07/23 PHP
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
2010/06/18 Javascript
Node.js抓取中文网页乱码问题和解决方法
2015/02/10 Javascript
分析了一下JQuery中的extend方法实现原理
2015/02/27 Javascript
jQuery控制cookie过期时间的方法
2015/04/07 Javascript
Windows系统下Node.js的简单入门教程
2015/06/23 Javascript
Angular 页面跳转时传参问题
2016/08/01 Javascript
d3.js中冷门却实用的内置函数总结
2017/02/04 Javascript
bootstrap是什么_动力节点Java学院整理
2017/07/14 Javascript
mpvue 如何使用腾讯视频插件的方法
2018/07/16 Javascript
JS+CSS实现炫酷光感效果
2020/09/05 Javascript
JavaScript用document.write()输出换行的示例代码
2020/11/26 Javascript
[01:32]DOTA2次级联赛——首支职业女子战队选拔赛全记录
2014/10/23 DOTA
[03:57]《不朽》——2015DOTA2国际邀请赛—中国军团出征主题曲MV
2015/07/15 DOTA
[09:40]DAC2018 4.5 SOLO赛 MidOne vs Miracle
2018/04/06 DOTA
使用python编写简单的小程序编译成exe跑在win10上
2018/01/15 Python
python正则表达式面试题解答
2020/04/28 Python
Python实现删除时保留特定文件夹和文件的示例
2018/04/27 Python
Django2.1.3 中间件使用详解
2018/11/26 Python
python连接mongodb集群方法详解
2020/02/13 Python
美国单身专业人士在线约会网站:EliteSingles
2019/03/19 全球购物
波兰家居饰品和厨房配件网上商店:Maleomi
2020/12/15 全球购物
安全资金保障制度
2014/01/23 职场文书
国家助学金获奖感言
2014/01/31 职场文书
财务信息服务专业自荐书范文
2014/02/08 职场文书
廉洁使者实施方案
2014/03/29 职场文书
2014年党课学习材料
2014/05/11 职场文书
2015年暑期实践报告范文
2015/07/13 职场文书
《圆明园的毁灭》教学反思
2016/02/16 职场文书
2016简单的租房合同范本
2016/03/18 职场文书
golang生成并解析JSON
2022/04/14 Golang