jQuery遍历对象、数组、集合实例

时间：2023-01-15 20:44:09

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>

jQuery遍历对象、数组、集合实例的更多相关文章

  1. jquery遍历对象&comma;数组&comma;集合

    1.jquery 遍历对象 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTM ...

  2. Jquery遍历筛选数组的几种方法和遍历解析json对象&vert;Map&lpar;&rpar;方法详解

    Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解 一.Jquery遍历筛选数组 1.jquery grep()筛选遍历数组 $().ready( function(){ v ...

  3. JQuery遍历json数组的3种方法

    这篇文章主要介绍了JQuery遍历json数组的3种方法,本文分别给出了使用each.for遍历json的方法,其中for又分成两种形式,需要的朋友可以参考下 一.使用each遍历 $(functio ...

  4. jquery实现对象数组 筛选出每条记录中的特定属性字段 及根据某个属性值筛选出指定的元素

    jquery实现对象数组 筛选出每条记录中的特定属性字段 直接上图: 源码: /** * 对后端返回的数据,筛选出符合报表的列项,多余的列项去除 */ function filterParams(da ...

  5. js、jquery遍历对象

    js遍历对象: var obj = {a:1,b:2,c:3} for(var s in obj){ alert(obj[s]); } jquery遍历对象: var obj = {a:1,b:2,c ...

  6. JS 遍历对象 jQuery遍历对象

    jquery for 循环遍历对象的属性: //对象的定义如下: var person={id:"1",name:"springok",age:25}; for ...

  7. JS&sol;jQuery 遍历对象属性

    Javascript For/In 循环: 循环遍历对象的属性 var person={fname:"John",lname:"Doe",age:25}; fo ...

  8. JQuery 遍历 操作数组 map、grep、filter 的区别

    filter() 方法将匹配元素集合缩减为匹配指定选择器的元素.例如:改变所有 div 的颜色,然后向类名为 "middle" 的类添加边框:$("div"). ...

  9. 【转】 jquery遍历json数组方法

    $(function () { var tbody = ""; //------------遍历对象 .each的使用------------- //对象语法JSON数据格式(当服 ...

随机推荐

  1. no CONFIG&lowbar;BQL

    [PATCH] net: make CONFIG_BQL actually end user configurable Without the defining string or help text ...

  2. ENVI 5&period;0 Beta 体验——影像数据的显示

    ENVI 5.0 Beta采用了全新的软件界面,数据的显示和操作跟以往的三视窗方式有很大的区别,下面一块体验一下. 对于栅格数据的显示方面,5.0有了非常大的改进,采用的全新的金字塔计算方法,在第一次 ...

  3. 【转】如何从零开始学会 Ruby on Rails&quest;

    文章转自:http://huacnlee.com/blog/how-to-start-learning-ruby-on-rails/ 这个话题曾经给身边的很多朋友说过同样的话题,这里整理以下. 如果你 ...

  4. query等待ajax执行完毕再继续执行下面代码的操作

    Jquery等待ajax执行完毕再继续执行下面代码的效果,具体代码如下,其实就是将 jquery ajax 函数的 async 参数设置为 false 即可,该参数默认为 true: $(docume ...

  5. 高性能 TCP &amp&semi;amp&semi; UDP 通信框架 HP-Socket v3&period;2&period;3 正式宣布

    HP-Socket 是一套通用的高性能 TCP/UDP 通信框架,包括服务端组件.client组件和 Agent 组件.广泛适用于各种不同应用场景的 TCP/UDP 通信系统,提供 C/C++.C#. ...

  6. qt执行cmd命令

    源地址:http://blog.csdn.net/hn307165411/article/details/6858614 运行 route.ipconfig 肯定没问题 Copy code QProc ...

  7. hdu4717 The Moving Points&lpar;二分做法&rpar;

    这道题看了大家都是用三分做的,其实这道题也是可以用二分来做的,就是利用一下他们的单调性. 对于N个点,总共要考虑N(N+1)/2个距离,距离可以用二次函数表示,而且开口都是向上的. 下面具体说一下二分 ...

  8. null transform hack 强制使用硬件加速

    -webkit-transform: translateZ(0); -webkit-transform: translate3d(0,0,0);   作用: 1.切换到硬件合成模式,通常所有事情都CP ...

  9. sorted函数返回一个新的列表就安全了吗&quest;

    arr=[[1,2,3],[4,2,3],[5,2,3]] x2=sorted(arr) print 'sorted',x2 print '-'*20 for ar in arr: ar.append ...

  10. Linux学习之ACL权限详解&lpar;十&rpar;

    Linux系统ACL权限详解 目录 ACL权限简介与开启 查看与设定ACL权限 最大有效权限与删除ACL权限 默认ACL权限和递归ACL权限 ACL权限简介与开启权限 ACL权限简介 用户权限管理始终 ...

相关文章