1. JQuery遍历对象
  2.  
  3. <!DOCTYPE html>
  4. <html lang="en">
  5. <head>
  6. 	<meta charset="UTF-8">
  7. 	<title>Document</title>
  8. </head>
  9. <body>
  10. 	<div id="project">
  11.  
  12. 	</div>
  13.   <script language="javascript" type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  14.   <script  type="text/javascript">
  15.      $(function(){
  16.        var tbody = "";
  17.     //------------遍历对象 .each的使用-------------
  18.      //前提必须是对象，一般情况下，后台传过来json字符串，要使用相应的方法将其转化为对象（eval、str.parseJSON()、JSON.parse(str)）。
  19.     var obj =[{"name":"项海军","password":"123456"}];
  20.    //下面使用each进行遍历
  21.    $.each(obj,function(index,value) {
  22.            console.log(index);  
               console.log(value);
               console.log(index + "  " + value);
  23.            var trs = "";
  24.              trs += "<tr><td>" + value.name +"</td> <td>" + value.password +"</td></tr>";
  25.              tbody += trs;
  26.            });
  27.          $("#project").append(tbody);  
  28.  
  29.   });
  30.   </script>
  31. </body>
  32. </html>

　　JQuery遍历数组

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="UTF-8">
  5. 	<title>Document</title>
  6. </head>
  7. <body>
  8. 	<div id="project">
  9.  
  10. 	</div>
  11.     <script language="javascript" type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  12.   <script  type="text/javascript">  
  13.  
  14.   $(function(){
  15.        var tbody = "";
  16.      //------------遍历数组 .each的使用-------------
  17.        var anArray = ['mma','bba','gge'];
  18.      $("#result").html("------------遍历数组 .each的使用-------------");
  19.            $.each(anArray,function(index,value) {
  20.            	console.log(index);
  21.            	console.log(value);
  22.                 console.log(index+' '+value);
  23.             var trs = "";
  24.              trs += "<tr><td>" +value+"</td></tr>";
  25.               tbody += trs;  
                  $("#project").append(tody);   //这个地方不能这样写，正确的写法是写在循环外面 检验的方法是console.log(tody)就知道什么情况了
  26.             });
  27.       $("#project").append(tbody);
  28.   });  
  29.  
  30.   </script>
  31. </body>
  32. </html>

　　

随机推荐

  1. AndroidTest.java

    以下代码使用ApiDemos-debug.apk进行测试 package com.saucelabs.appium; import io.appium.java_client.AppiumDriver ...

  2. 【Selenium】IE浏览器启动问题

    DesiredCapabilities ieCapabilities = DesiredCapabilities.internetExplorer();ieCapabilities.setCapabi ...

  3. linux系统配置之服务程序的开机自启动（centos）

    CentOS安装好apache.mysql等服务器程序后,并没有设置成开机自动启动的,为避免重启后还要手动开启web等服务器,还是做下设置好,其实设置很简单,用chkconfig命令就行了. 例如,要 ...

  4. Springboot框架中request.getInputStream()获取不到上传的文件流

    Springboot框架中用下面的代码,使用request.getInputStream()获取不到上传的文件流 @PostMapping("/upload_img") publi ...

  5. C3P0 配置

    C3P0是一个开源的JDBC连接池. 在Spring中,C3P0的一些配置,介绍如下(只列了一部分,不是全部) <!-- c3p0连接池配置 --> <bean id="d ...

  6. margin-top 为什么会影响父元素的 margin-top

    1.原因:  In this specification, the expression collapsing margins means that adjoining margins (no non ...

  7. Nwjs简单配置

    1.创建一个工程,配置一个  package.json 文件 { "name": "application-name", "version" ...

  8. JavaScript-Tool-导向：jquery.steps-un

    ylbtech-JavaScript-Tool-导向:jquery.steps 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部 0. http://www.jqu ...

  9. 编写 DockerFile

    编写 DockerFile 本节内容简介 在前面的实验中我们多次用到的 Dockerfile,在本实验里我们将通过完成一个实例来学习Dockerfile的编写. 本节中,我们需要依次完成下面几项任务: ...

  10. HTML5/jQuery雷达动画图表 图表配置十分简单

    1.HTML5/jQuery雷达动画图表 图表配置十分简单 之前我们介绍过不少形形色色的HTML5图表了,像这款HTML5折线图表Aristochart是一款很不错的折线图表,这款HTML5 Canv ...