jquery

.each(function)

function

Type: Function( Integer index, Element element )

A function to execute for each matched element.

exmple

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4   <meta charset="utf-8">
 5   <title>each demo</title>
 6   <style>
 7   div {
 8      40px;
 9     height: 40px;
10     margin: 5px;
11     float: left;
12     border: 2px blue solid;
13     text-align: center;
14   }
15   span {
16     color: red;
17   }
18   </style>
19   <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
20 </head>
21 <body>
22  
23 <button>Change colors</button>
24 <span></span>
25 <div></div>
26 <div></div>
27 <div></div>
28 <div></div>
29 <div id="stop">Stop here</div>
30 <div></div>
31 <div></div>
32 <div></div>
33  
34 <script>
35 $( "button" ).click(function() {
36   $( "div" ).each(function( index, element ) {
37     // element == this
38     $( element ).css( "backgroundColor", "yellow" );
39     if ( $( this ).is( "#stop" ) ) {
40       $( "span" ).text( "Stopped at div index #" + index );
41       return false;
42     }
43   });
44 });
45 </script>
46  
47 </body>
48 </html>

jQuery.each()

jQuery.each( array, callback )

array

Type: Array

The array to iterate over.
callback

Type: Function( Integer indexInArray, Object value )

The function that will be executed on every object.

jQuery.each( object, callback )

object

Type: Object

The object to iterate over.
callback

Type: Function( String propertyName, Object valueOfProperty )

The function that will be executed on every object.

Examples

 1 Iterates over items in an array, accessing both the current item and its index.
 2 
 3 $.each( [ "a", "b", "c" ], function( i, l ){
 4   alert( "Index #" + i + ": " + l );
 5 });
 6 
 7 Iterates over the properties in an object, accessing both the current item and its key.
 8 
 9 $.each({ name: "John", lang: "JS" }, function( k, v ) {
10   alert( "Key: " + k + ", Value: " + v );
11 });

　以上。

　　在一些使用迭代方法生成html文档的地方，使用用each函数会事半功倍。

项目代码：(仿PHP官网搜索框部分代码)

 1 $('#search_doc').on("keyup",function(){ 
 2         //remove and add the title ,make the title show before tt-dataset
 3         $('div.tt-menu h3').each(function(){
 4             var $dataset = $(this);
 5             var dataset_clo = $dataset.closest('.tt-dataset');
 6             // locate the tag h3
 7             if(dataset_clo.prev().is('h3')){
 8                 dataset_clo.prev().remove();
 9             }else if($dataset.next().text() == ''){
10                 $dataset.remove();
11             }
12             // if the category has content,then insert the title before the tt-dataset
13             if(dataset_clo.has('a').length){
14                 $dataset.insertBefore(dataset_clo);
15             }
16         });
17 });

jquery

.each(function)

jQuery.each()

jQuery.each( array, callback )

jQuery.each( object, callback )

Examples