1、设计源码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>利用JavaScript遍历JSON数组</title>
<script type="text/javascript">
     function traJsonArray()
	 {
		 var jsonArray = [{"id":"100","name":"zhangsan","age":"23","sex":"man"},{"id":"101","name":"lisi","age":"21","sex":"woman"},{"id":"102","name":"wangwu","age":"22","sex":"man"}];
		 var inputText = "";
		 for(var json in jsonArray)
		 {
			 for(var key in jsonArray[json])
			 {
				inputText += jsonArray[json][key]+",";
			 }
		 }

		 document.getElementById("areaText").innerText = inputText;
	 }
</script>
</head>

<body>
   <div>
      <input type="button" id="btn" onclick="traJsonArray()" value="利用JavaScript遍历JSON数组"/>
      <textarea id="areaText" cols="80" rows="30"></textarea>
   </div>
</body>
</html>

2、设计结果

如何利用JavaScript遍历JSON数组的更多相关文章

  1. jquery $.each遍历json数组方法

    <!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/ ...

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

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

  3. javascript遍历json对象数据的方法

    JSON中,有两种结构:对象和数组,对象是没有length这个属性,而数组结构是有的,下面分别说下这两种结构之间的区别和遍历方式. 1.对象 一个对象以“{”开始,“}”结束.每个“key”后跟一“: ...

  4. $.each遍历json数组

    1.遍历单层json数组 我们把idx和obj都打印出来看看,到底是什么东西 var json1 =[{"id":"1","tagName" ...

  5. jquery $.each()遍历json数组

    使用jQuery的$.each()方法来遍历一个数组对象 var json=[ {"id":"1","tagName":"appl ...

  6. Json格式循环遍历,Json数组循环遍历

    Json格式数据如何遍历,这里我们可以用for..in实现 例如最简单的json格式 , 'handsome' : 'yes' }; for( var key in json1 ){ console. ...

  7. jquery遍历获取带checkbox表格的选中值以及遍历json数组

    今天整理了一下jquery遍历的两个用法,分享给大家. 1.$().each 主要用来遍历DOM元素,获取DOM的值或样式等. 2.$.each() 主要用来遍历后台ajax返回的json数组,循环将 ...

  8. jQuery 遍历json数组的实现代码

    <script type="text/javascript"> "}]; $(d1).each(function(){ alert(this.text+&qu ...

  9. 遍历json数组实现树

    今天小颖在工作中遇到要遍历树得问题了,实现后,怕后期遇到又忘记啦,所以记录下嘻嘻,其实这个和小颖之前写过得一篇文章    json的那些事    中第4点有关json的面试题有些类似. 数组格式: v ...

随机推荐

  1. Jmeter_脚本参数化与内存溢出的解决方案

    这一篇文章随便说一下JMETER的脚本参数化 1:Parameters的两种参数化方法 1.1:函数助手参数化 首先准备你的参数数据.我在bin/data中新建了一个dat文件,记事本另存为修改编码为 ...

  2. spring jdbc踩坑日记，new JdbcTemplate 为null导致UserDao一直为null

    private DataSource datasource; private JdbcTemplate jdbcTemplateObject; //设置注入 public void setdataso ...

  3. Why Are Thread.stop, Thread.suspend, Thread.resume and Runtime.runFinalizersOnExit Deprecated ?

    Thread.stop, Thread.suspend, Thread.resume被标记为废弃的方法.在查看JDK的文档时,提到了下面的参考文章,先是英文版,接着是中文翻译. Why is Thre ...

  4. HDU [P1704] Rank

    传递闭包裸题 但是本题的Floyd一定要优化,不然会T cpp #include <iostream> #include <cstdio> #include <cstri ...

  5. POJ 2404 Jogging Trails [DP 状压 一般图最小权完美匹配]

    传送门 题意:找一个经过所有边权值最小的回路,$n \le 15$ 所有点度数为偶则存在欧拉回路,直接输出权值和 否则考虑度数为奇的点,连着奇数条边,奇点之间走已经走过的路移动再走没走过的路 然后大体 ...

  6. Eclipse多平台编译(armeabi, armeabi-v7a, x86, mips)

    Jni目录下新增Application.mk,加入 APP_ABI := armeabi armeabi-v7a x86 mips 上面的平台可加可减,全编的话可以写为 APP_ABI := all ...

  7. 使用IntelliJ IDEA（PHPStorm）和xdebug在firefox、chrome中远程调试PHP

    很多PHP程序员都习惯于使用echo.var_dump和exit来中断和调试web应用程序,本文主要介绍结合xdebug.IntelliJ IDEA.Firefox/chrome/IE来远程调试PHP ...

  8. 简单认识一下什么是vue-router

    什么是vue-router? 用通俗一点的话来讲,其实就是一个url和组件之间的映射关系,当我们访问不同的url的时候在页面渲染不同的组件 vue-router怎么用? vue-router作为一个v ...

  9. Linux ipip隧道及实现

    一.IP隧道技术 IP隧道技术:是路由器把一种网络层协议封装到另一个协议中以跨过网络传送到另一个路由器的处理过程.IP 隧道(IP tunneling)是将一个IP报文封装在另一个IP报文的技术,这可 ...

  10. Filezilla Server日志文件

    Filezilla Server版本:0.9.41. Filezilla Server日志文件在软件安装目录下Logs目录下. 但Filezilla Server默认不开始日志记录,如何开启filez ...