JSON: JSON 用法
| ylbtech-JSON: JSON 用法 |
| 1. JSON Object creation in JavaScript返回顶部 |
<!DOCTYPE html>
<html>
<body>
<h2>JSON Object creation in JavaScript</h2>
<p>
Name:<span id="jname"></span><br />
Age:<span id="jage"></span><br />
Address:<span id="jaddress"></span><br />
Phone:<span id="jphone"></span><br />
</p>
<script>
var JSONObject = {
"name": "John Johnson",
"street": "Oslo West 555",
"age": 33,
"phone":"555 1234567"
};
document.getElementById("jname").innerHTML = JSONObject.name;
document.getElementById("jage").innerHTML = JSONObject.age;
document.getElementById("jaddress").innerHTML = JSONObject.street;
document.getElementById("jphone").innerHTML = JSONObject.phone;
</script>
</body>
</html>
JSON Object creation in JavaScript
Name:John Johnson
Age:33
Address:Oslo West 555
Phone:555 1234567
| 2. Create Object from JSON String返回顶部 |
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>First Name:<span id="fname"></span></p>
<script>
var employee = [
{ "firstName": "John", "lastName": "Doe" },
{ "firstName": "Anna", "lastName": "Smith" },
{ "firstName": "Peter", "lastName": "Jones" }
];
employee[1].firstName = "Jonatan";
document.getElementById("fname").innerHTML = employee[1].firstName;
</script>
</body>
</html>
Create Object from JSON String
First Name:Jonatan
| 3. 从 JSON 字符串中创建对象返回顶部 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>示例</title>
</head>
<body>
<h2>从 JSON 字符串中创建对象</h2>
<p>
名:<span id="fname"></span><br />
姓:<span id="lname"></span><br />
</p>
<script>
var txt = '{"employees":[' + '{"firstName":"John","lastName":"Doe"}'
+ ',{"firstName":"Anna","lastName":"Smith"}'
+ ',{"firstName":"Peter","lastName":"Jones"}]}'; var obj = eval("(" + txt + ")"); document.getElementById("fname").innerHTML = obj.employees[1].firstName;
document.getElementById("lname").innerHTML = obj.employees[1].lastName;
</script>
<script>
document.getElementById("fname").innerHTML = obj.employees[1].firstName;
document.getElementById("lname").innerHTML = obj.employees[1].lastName;
</script>
</body>
</html>
从 JSON 字符串中创建对象
名:Anna
姓:Smith
| 4. JSONP 实例返回顶部 |
<!DOCTYPE html>
<html>
<head>
<title>JSONP 实例</title>
</head>
<body>
<div id="divCustomers"></div>
<script type="text/javascript">
function callbackFunction(result, methodName) {
var html = '<ul>';
for (var i = 0; i < result.length; i++) {
html += '<li>' + result[i] + '</li>';
}
html += "</ul>";
document.getElementById("divCustomers").innerHTML = html;
}
</script>
<script type="text/javascript" src="http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction"></script>
</body>
</html>
- customername1
- customername2
| 5. Create Object from JSON String返回顶部 |
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>
名:<span id="fname"></span><br />
姓:<span id="lname"></span><br />
</p>
<script>
var txt = '{"employees":[' + '{"firstName":"John","lastName":"Doe"}'
+ ',{"firstName":"Anna","lastName":"Smith"}'
+ ',{"firstName":"Peter","lastName":"Jones"}]}'; var obj = JSON.parse(txt); document.getElementById("fname").innerHTML = obj.employees[1].firstName;
document.getElementById("lname").innerHTML = obj.employees[1].lastName;
</script>
<script>
document.getElementById("fname").innerHTML = obj.employees[1].firstName;
document.getElementById("lname").innerHTML = obj.employees[1].lastName;
</script>
</body>
</html>
Create Object from JSON String
名:Anna
姓:Smith
3、
| 6. JSNP 实例返回顶部 |
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>JSNP 实例</title>
<meta charset="utf-8" />
<script src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.js"></script>
</head>
<body>
<div id="divCustomers"></div>
<script>
$.getJSON("http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=?", function (data) {
var html = '<ul>';
for(var i=0;i<data.length;i++)
{
html += '<li>' +data[i]+ '</li>';
}
html += "</ul>";
$('#divCustomers').html(html);
});
</script>
</body>
</html>
- customername1
- customername2
| 7.返回顶部 |
| 8.返回顶部 |
| 9.返回顶部 |
| 10.返回顶部 |
| 11.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
JSON: JSON 用法的更多相关文章
- 再谈Newtonsoft.Json高级用法
上一篇Newtonsoft.Json高级用法发布以后收到挺多回复的,本篇将分享几点挺有用的知识点和最近项目中用到的一个新点进行说明,做为对上篇文章的补充. 阅读目录 动态改变属性序列化名称 枚举值序列 ...
- JSON基本用法
JSON基本用法 2016-08-10 16:42:19 JSON的全称是“JavaScript Object Notation”,意思是JavaScript对象表示法,它是一种基于文本,独立于语 ...
- Jquery之JSON的用法
今天讲了Jquery里面JSON的用法,下面是今天讲课给的例子: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" &quo ...
- Newtonsoft.Json高级用法之枚举中文转义
最近看博客园中 焰尾迭的两篇关于"Newtonsoft.Json高级用法"的文章受到了很多人的评论,一度登入到头条推荐. 今天我就不再重复焰尾迭博文中的一些提过的Newtonsof ...
- 将php数组转js数组,js如何接收PHP数组,json的用法
首先下载下面这个文件(这是一段是别人写出来专门解析json的代码),然后引入这个文件! http://pan.baidu.com/s/1dD8qVr7 现在当我们需要用ajax与后台进行交互时,怎样将 ...
- $.ajax中contentType: “application/json” 的用法
不使用contentType: “application/json”则data可以是对象 $.ajax({ url: actionurl, type: "POST", datTyp ...
- 【c#技术】一篇文章搞掂:Newtonsoft.Json Json.Net
一.介绍 Json.Net是一个.Net高性能框架. 特点和好处: 1.为.Net对象和JSON之间的转换提供灵活的Json序列化器: 2.为阅读和书写JSON提供LINQ to JSON: 3.高性 ...
- Newtonsoft.Json(Json.Net)学习笔记
Newtonsoft.Json 在Vs2013中就有自带的: 下面是Json序列化和反序列化的简单封装: /// <summary> /// Json帮助类 /// </summar ...
- Newtonsoft.Json(Json.Net)学习笔记(转)
概述 Newtonsoft.Json,一款.NET中开源的Json序列化和反序列化类库,通过Nuget获取.(查看原文) 下面是Json序列化和反序列化的简单封装: /// <summary&g ...
- JSON之Asp.net MVC C#对象转JSON,DataTable转JSON,List转JSON,JSON转List,JSON转C#对象
一.JSON解析与字符串化 JSON.stringify() 序列化对象.数组或原始值 语法:JSON.stringify(o,filter,indent) o,要转换成JSON的对象.数组或原始值 ...
随机推荐
- 太完美 TWM000极度精简版XP20130123终结美化版
TWM000极度精简版XP20130123终结美化版:蛋蛋20130123终结版为蓝本,虫子提供的美化包进行了美化.此版经测试完美在Z77主板开启AHCI安装,此为最终版之美化版!LiteXPMH.i ...
- easyui常用属性
属性分为CSS片段和JS片段. CSS类定义:1.div easyui-window 生成一个window窗口样式. 属性如下: 1)mod ...
- makefile的一个错误:*** missing separator
原文转自:http://blog.sina.com.cn/s/blog_87c063060101c9yp.html 1.在写 多目录下makefile的时候,碰到一个错误提示,让我纠结许久,后面还是解 ...
- django model 不设置default='' 会出错
当django中的model没有设置default = ''时,会弹出提示信息.在model中加上默认值为空,这样就不会对数据库的必填字段留空造成错误,导致数据库出错,系统崩溃.
- linux 优化git操作速度
修改 ssh配置:useDNS:no
- python3:xlrd、xlwt、xlutils处理excel文件
1.xlrd读取excel 请参考上篇博客https://www.cnblogs.com/shapeL/p/9075843.html 2.xlwt生成excel 安装下载:pip install xl ...
- hog+svm+检测人(代替默认的参数)
#include <iostream>#include <opencv2/core/core.hpp>#include <opencv2/highgui/highgui. ...
- stm32 看门狗配置
1.独立看门狗: 1) 取消寄存器写保护(向 IWDG_KR 写入 0X5555) IWDG_WriteAccessCmd(IWDG_WriteAccess_Enable); //使能或者失能 2) ...
- Navicat #1045 - Access denied for user 'root'@'localhost' (using password: NO)
Navicat #1045 - Access denied for user 'root'@'localhost' (using password: YES) 出现上述问题,原因在于本机还开了APMS ...
- HihoCoder - 1886 :中位数2(贪心)
描述 对于一个长度为n的数列A,我们如下定义A的中位数med(A): 当n是奇数时,A的中位数是第(n+1)/2大的数:当n是偶数时,A的中位数是第n/2大的数和第n/2+1大的数的平均值. 同时,我 ...
