JQuery traverses objects arrays and collection instances

  • 2020-03-30 04:17:40
  • OfStack

1. Jquery traverses objects

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <script language="javascript" type="text/javascript" src="jquery.min.js"></script> 
  <script  type="text/javascript"> 
     $(function(){ 
 
       var tbody = "";     
    //-- traversing the use of object. Each --& NBSP; < br / >       //Object syntax JSON data format (when a server-side callback comes back in a JSON data format, the JSON format must be guaranteed, and the callback Object must be converted using the eval function (otherwise it will not get Object). This article does not go into detail on the data issues of server-side callbacks, we will customize the object directly. < br / >     var obj =[{"name":" A navy ","password":"123456"}]; 
   $("#result").html("------------ Traverse object .each The use of -------------"); 
      alert(obj);//Is the object element & NBSP; < br / >    //The next step is to iterate with each & NBSP; < br / >    $.each(obj,function(n,value) {  
           alert(n+' '+value); 
           var trs = ""; 
             trs += "<tr><td>" + value.name +"</td> <td>" + value.password +"</td></tr>"; 
             tbody += trs;        
           }); 
 
         $("#project").append(tbody); 
      
  }); 
  </script> 
 </HEAD> 
  
 <BODY> 
     <div id="result" style="font-size:16px;color:red;"></div> 
    <table cellpadding=5 cellspacing=1 width=620 id="project" border="1" > 
            <tr> 
                <th> The user name </th> 
                <th> password </th>               
            </tr>              
     </table> 
 </BODY> 
</HTML> 
   

2. JQuery iterates groups


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <script language="javascript" type="text/javascript" src="jquery.min.js"></script> 
  <script  type="text/javascript"> 
     $(function(){ 
 
       var tbody = ""; 
     
     //-- traversing the use of group. Each --& NBSP; < br / >            var anArray = ['one','two','three']; 
     $("#result").html("------------ Through the array .each The use of -------------"); 
           $.each(anArray,function(n,value) { 
            
            alert(n+' '+value); 
           var trs = ""; 
             trs += "<tr><td>" +value+"</td></tr>"; 
              tbody += trs; 
            }); 
 
          $("#project").append(tbody); 
      
  }); 
  </script> 
 </HEAD> 
  
 <BODY> 
    ------------ This part with 1 In the body Part of the -------------------- 
 
 </BODY> 
</HTML>

JQuery traverses a List collection (it's not much different from traversing an object, just a matter of format) & PI;

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
 <HEAD> 
  <TITLE> New Document </TITLE> 
  <script language="javascript" type="text/javascript" src="jquery.min.js"></script> 
  <script  type="text/javascript"> 
     $(function(){ 
 
       var tbody = ""; 
     
     //-- traversing the use of List collection. Each --& NBSP; < br / >       var obj =[{"name":" A navy ","password":"123456"},{"name":" Kobe Bryant ","password":"333333"}]; 
    $("#result").html(" traverse List A collection of .each The use of "); 
      alert(obj);//Is the object element & NBSP; < br / >    //The next step is to iterate with each & NBSP; < br / >    $.each(obj,function(n,value) {  
           alert(n+' '+value); 
       var trs = ""; 
             trs += "<tr><td>" +value.name+"</td> <td>" + value.password +"</td></tr>"; 
             tbody += trs;        
           }); 
         $("#project").append(tbody); 
      
  }); 
  </script> 
 </HEAD> 
  
 <BODY> 
       ------------ This part with 1 In the body Part of the -------------------- 
 
 </BODY> 
</HTML>


Related articles: