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动态加载javascript以减少服务器压力
Oct 29 Javascript
JavaScript mapreduce工作原理简析
Nov 25 Javascript
JS获取页面input控件中所有text控件并追加样式属性
Feb 25 Javascript
JS 实现导航栏悬停效果(续2)
Sep 24 Javascript
js获取对象为null的解决方法
Nov 21 Javascript
JavaScript实现彩虹文字效果的方法
Apr 16 Javascript
JavaScript实现函数返回多个值的方法
Jun 09 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
Sep 12 Javascript
JavaScript图像延迟加载库Echo.js
Apr 05 Javascript
JavaScript简单验证表单空值及邮箱格式的方法
Jan 20 Javascript
小程序简单两栏瀑布流效果的实现
Dec 18 Javascript
JavaScript实现酷炫的鼠标拖尾特效
Feb 18 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
mongo Table类文件 获取MongoCursor(游标)的实现方法分析
2013/07/01 PHP
php批量删除操作代码分享
2017/02/26 PHP
做网页的一些技巧
2007/02/01 Javascript
Jquery 获取checkbox的checked问题
2011/11/16 Javascript
无闪烁更新网页内容JS实现
2013/12/19 Javascript
jquery仿搜索自动联想功能代码
2014/05/23 Javascript
JSP中使用JavaScript动态插入删除输入框实现代码
2014/06/13 Javascript
js实现div闪烁原理及实现代码
2014/06/24 Javascript
Node.js实现批量去除BOM文件头
2014/12/20 Javascript
js简单实现Select互换数据的方法
2015/08/17 Javascript
jQuery Mobile动态刷新页面样式的实现方法
2016/05/28 Javascript
jQuery处理XML文件的几种方法
2016/06/14 Javascript
JS计算距当前时间的时间差实例
2017/12/29 Javascript
通过JS判断网页是否为手机打开
2020/10/28 Javascript
[06:14]《辉夜杯》外卡赛附加赛 4支战队巡礼
2015/10/23 DOTA
Python中捕捉详细异常信息的代码示例
2014/09/18 Python
Django缓存系统实现过程解析
2019/08/02 Python
Python实现区域填充的示例代码
2021/02/03 Python
css3 pointer-events 介绍详解
2017/09/18 HTML / CSS
ETO男装官方网店:ETO Jeans
2019/02/28 全球购物
俄罗斯女装店:12storeez
2019/10/25 全球购物
维多利亚的秘密阿联酋官网:Victoria’s Secret阿联酋
2019/12/07 全球购物
信息系统专业个人求职信范文
2013/12/07 职场文书
大学生职业规划范文:象牙塔生活的四年计划
2014/01/14 职场文书
考试诚信承诺书
2014/05/23 职场文书
电子信息专业应届生自荐信
2014/06/04 职场文书
2014年监理工作总结范文
2014/11/17 职场文书
2014年骨干教师工作总结
2014/12/19 职场文书
2015年女生节活动总结
2015/02/27 职场文书
个人年终总结怎么写
2015/03/09 职场文书
家长会后的感想
2015/08/11 职场文书
2017寒假社会实践心得体会范文
2016/01/14 职场文书
英文诗歌翻译方法(赏析)
2019/08/16 职场文书
创业计划书之儿童理发店
2019/09/27 职场文书
CSS3实现的水平标题菜单
2021/04/14 HTML / CSS
Python控制台输出俄罗斯方块的方法实例
2021/04/17 Python