JQuery search for child elements find() and traverse the collection each method example sharing-JS Tutorial-php.cn

JQuery search for child elements find() and traverse the collection each method example sharing

小云云

Release： 2018-01-23 13:26:11

Original

4431 people have browsed it

This article mainly brings you a summary of JQuery's method of finding sub-elements find() and traversing the collection each. The editor thinks it is quite good, so I will share it with you now and give it as a reference for everyone. Let's follow the editor and take a look. I hope that everyone can better master the use of find() and traversing the collection each.

1.HTML code

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

Copy after login

2.jquery

<script type="text/javascript"> 
 /* find() 查找子元素方法 */ 
 var aaa = $("p[name='students'][school='HK']").find("input[type='boy'][name='ZhangSan']"); 
 console.log(aaa.val()); 
  
 /* $(".child",parent); 方法查找子元素*/ 
 var bbb = $($("input[type='boy'][name='ZhangSan']"),$("p[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元素 */ 
 $("p[name='students'][school='HK'] > input").each(function() { 
  console.log($(this).val()); 
 }); 
 </script>

Copy after login

Related recommendations:

find() and filter() in jQuery ) Detailed explanation of operation usage examples

Usage examples of find() method in jQuery

focusin(), focus() and find() in jQuery The difference between children()

The above is the detailed content of JQuery search for child elements find() and traverse the collection each method example sharing. For more information, please follow other related articles on the PHP Chinese website!