zoukankan      html  css  js  c++  java
  • jquery 遍历 数组1

     使用了jquery有段时间了,整理下jquery中的遍历问题。

    1.jquery 遍历对象

    <!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 = "";    
        //------------遍历对象 .each的使用-------------
          //对象语法JSON数据格式(当服务器端回调回来的对象数据格式是json数据格式,必须保证JSON的格式要求,回调的对象必须使用eval函数进行转化(否则将得不到Object)。本文不作详细介绍服务器端回调的数据问题,我们将直接自定义对象)
        var obj =[{"name":"项海军","password":"123456"}];
       $("#result").html("------------遍历对象 .each的使用-------------");
          alert(obj);//是个object元素
       //下面使用each进行遍历
       $.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>用户名</th>
                    <th>密码</th>              
                </tr>             
         </table>
     </BODY>
    </HTML>

    2.jQuery遍历数组

    <!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 = "";
        
         //------------遍历数组 .each的使用-------------
               var anArray = ['one','two','three'];
         $("#result").html("------------遍历数组 .each的使用-------------");
               $.each(anArray,function(n,value) {
               
                alert(n+' '+value);
               var trs = "";
                 trs += "<tr><td>" +value+"</td></tr>";
                  tbody += trs;
                });

              $("#project").append(tbody);
         
      });
      </script>
     </HEAD>
     
     <BODY>
        ------------此部分同1中的body部分--------------------

     </BODY>
    </HTML>

    3.jQuery 遍历List集合(其实与遍历一个对象没有太大区别,只是格式上的问题)

    <!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 = "";
        
         //------------遍历List集合 .each的使用-------------
          var obj =[{"name":"项海军","password":"123456"},{"name":"科比","password":"333333"}];
        $("#result").html("遍历List集合 .each的使用");
          alert(obj);//是个object元素
       //下面使用each进行遍历
       $.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>
           ------------此部分同1中的body部分--------------------

     </BODY>
    </HTML>

  • 相关阅读:
    【故障处理】ORA-12162: TNS:net service name is incorrectly specified (转)
    android studio 编程中用到的快捷键
    java时间格式串
    android Error occurred during initialization of VM Could not reserve enough space for object heap Could not create the Java virtual machine.
    linux安装vmware
    x1c 2017 安装mint18的坑——grub2
    x1c2017 8G版 win linux的取舍纠结记录
    python的try finally (还真不简单)
    kafka+docker+python
    json文件不能有注释
  • 原文地址:https://www.cnblogs.com/fantiejun/p/3444320.html
Copyright © 2011-2022 走看看