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. 前端-css

    页面css排版不错乱: 1.最外层div中 定义width=980px,当页面缩小以后,就在下面出现滚动条 2.使用 media 技术,bootstrp技术.页面自使用 一.css选择器 选择器 样式 ...

  2. php应用pack函数转unicode为utf8

    因为时常用到json_encode去处理数据,json_encode在处理字符串遇上中文时,会把中文转换成\u5371这种格式的字符串,如果想让它能正常显示中文,则可以用pack打包函数进行处理. 以 ...

  3. python学习交流 - 匿名函数

    匿名函数 匿名函数是一个很有特色的定义函数的功能.在实际使用的过程,用户有时不得不为一些一行代码即可实现的功能来定义一个函数,例如像map, max, filter等内置函数的key参数只能接收可调用 ...

  4. Tomcat部署war应用总结

    前言:罗列在Tomcat部署web应用的几种方法,供以后翻阅,其中的以helloapp为例 Tomcat目录介绍 简单目录介绍: bin目录:包含tomcat启动/关闭等脚本,支持linux.wind ...

  5. 700名黑客无法攻破Trillium安全防护软件 欲以网络安全险获利

    盖世汽车讯 据外媒报道,在2017 DEF CON黑客大会上,黑客们受邀入侵Car Hacking Village会场内的各类自动驾驶车辆.物联网网络安全公司--Trillium Incorporat ...

  6. java对象表示方式--XStream

    对象表示有各种各样的方式,序列化只是其中的一种而已.表示一个对象的目的无非就是为了对象<---->IO之间相互认识,至于怎么认识,那就有很多选择了.除了之前讲过的序列化,还可以选择将数据J ...

  7. hdu 4609 3-idiots [fft 生成函数 计数]

    hdu 4609 3-idiots 题意: 给出\(A_i\),问随机选择一个三元子集,选择的数字构成三角形的三边长的概率. 一开始一直想直接做.... 先生成函数求选两个的方案(注意要减去两次选择同 ...

  8. vue2.0实现前端星星评分功能组件

    <template id="pingJia"> <div> <ul> <li :class="{li1:1,bg1:index% ...

  9. python dns查询与DNS传输漏洞查询

    前言: 昨天晚上在看DNS协议,然后想到了 DNS传输漏洞.便想写一个DNS查询与DNS传输漏洞查询 DNS传输漏洞介绍: DNS传输漏洞:若DNS服务器配置不当,可能导致匿名用户获取某个域的所有记录 ...

  10. LVS的NAT模式测试

    dir 分别配置ip  eth0 :10.222.138.200   eth0:1 10.222.21.190 rs1 eth0  :10.222.138.201 rs2 eth0: 10.222.1 ...