把 JSON 文本转换为 JavaScript 对象

JSON 最常见的用法之一，是从 web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。

为了更简单地为您讲解，我们使用字符串作为输入进行演示（而不是文件）

json.html 
  1. <html>
  2.     <body>
  3.         <h2>
  4.             通过 JSON 字符串来创建对象
  5.             </h3>
  6.             <p>
  7.                 First Name:
  8.                 <span id="fname"></span>
  9.                 <br />
  10.                 Last Name:
  11.                 <span id="lname"></span>
  12.                 <br />
  13.             </p>
  14.             <script type="text/javascript">
  15.     var txt = '{"employees":[' + '{"firstName":"Bill","lastName":"Gates" },' + '{"firstName":"George","lastName":"Bush" },' + '{"firstName":"Thomas","lastName":"Carter" }]}';
  16.  
  17.     var obj = eval("(" + txt + ")");
  1.     document.getElementById("fname").innerHTML = obj.employees[1].firstName
  2.     document.getElementById("lname").innerHTML = obj.employees[1].lastName
  3. </script>
  4.     </body>
  5. </html>

或者：

  1. obj = JSON.parse(txt);

 

结果显示:

简单使用JSON,通过JSON 字符串来创建对象(二)的更多相关文章

  1. json对象与字符串的相互转换,数组和字符串的转换

    1.json对象转换为字符串 JSON.stringify(value [, replacer] [, space])  var student = new Object(); student.id ...

  2. 使用 Newtonsoft.Json 操作 JSON 字符串

    一.把实体类转化为 JSON 字符串 1. 为实体类赋值 SenderFromMQSearch senderFromMQSearch = new SenderFromMQSearch(); sende ...

  3. 一、JSON解析与字符串化

    JSON.stringify() 序列化对象.数组或原始值 语法:JSON.stringify(o,filter,indent) o,要转换成JSON的对象.数组或原始值 filter,指定要序列化的 ...

  4. 第168天：json对象和字符串的相互转换

    json对象和字符串的相互转换 1.json对象和字符串的转换 在Firefox,chrome,opera,safari,ie9,ie8等高级浏览器直接可以用JSON对象的stringify()和pa ...

  5. python2.7字典转换成json时中文字符串变成unicode的问题：

    参考:http://blog.csdn.net/u014431852/article/details/53058951 编码问题: python2.7字典转换成json时中文字符串变成unicode的 ...

  6. json对象与字符串相互转换

    JSON 语法 JSON 语法规则 在 JS 语言中,一切都是对象.因此,任何支持的类型都可以通过 JSON 来表示,例如字符串.数字.对象.数组等.但是对象和数组是比较特殊且常用的两种类型: 对象表 ...

  7. 最简单简洁高效的Json数据解析

    一.无图无真相 二.主要代码 1.导入jar包 拷贝fastjson.jar包到projectlibs包下 2.封装工具类JsonUtil.java package com.example.parse ...

  8. 基于 Vue.js 之 iView UI 框架非工程化实践记要 使用 Newtonsoft.Json 操作 JSON 字符串 基于.net core实现项目自动编译、并生成nuget包 webpack + vue 在dev和production模式下的小小区别 这样入门asp.net core 之 静态文件 这样入门asp.net core，如何

    基于 Vue.js 之 iView UI 框架非工程化实践记要   像我们平日里做惯了 Java 或者 .NET 这种后端程序员,对于前端的认识还常常停留在 jQuery 时代,包括其插件在需要时就引 ...

  9. JSON 对象和字符串

    JSON 对象和字符串 粘贴自:https://www.cnblogs.com/cstao110/p/3762056.html Q:什么是"JSON字符串",什么是"JS ...

随机推荐

  1. js 利用iframe和location.hash跨域解决的方法，java图片上传回调JS函数跨域

    奶奶的:折腾了我二天,最终攻克了!网上有非常多样例. 但跟我的都不太一样,费话不多说了,上图   上代码: IE ,firefix,chrome 測试通过 js :这个主页面,部分代码, functi ...

  2. VS2013中实现angular代码智能提示

    第一步:在项目同添加angular js文件的引用: 这里使用NuGet包管理器来给项目添加angular js install-package angularjs 第二步:添加智能提示js文件 我们 ...

  3. iis配置PHP

    今天在服务器上配置PHP出现在下面的问题:“HTTP 错误 500.0 - Internal Server Error,C:\php\php-cgi.exe - FastCGI 进程意外退出”,下面说 ...

  4. socket在windows下和linux下的区别

    原文:socket在windows下和linux下的区别 1)头文件 windows下winsock.h/winsock2.h linux下sys/socket.h    错误处理:errno.h 2 ...

  5. 发现新大陆：一个最简单的破解SSL加密网络数据包的方法

    1. 简介 相信能访问到这篇文章的同行基本上都会用过流行的网络抓包工具WireShark,用它来抓取相应的网络数据包来进行问题分析或者其他你懂的之类的事情. 一般来说,我们用WireShark来抓取包 ...

  6. JS中实现A*算法寻路

    <html><head><title>use A* to find path...</title></head><body style ...

  7. log4e插件的安装和使用

    1.首先下载log4e小工具.放入myeclipse10安装文件夹D:\Program Files (x86)\myEclipse10\MyEclipse Blue Edition 10\dropin ...

  8. oracle 存储过程的基本语法

    原文:oracle 存储过程的基本语法 1.基本结构 CREATE OR REPLACE PROCEDURE 存储过程名字(    参数1 IN NUMBER,    参数2 IN NUMBER) I ...

  9. 使用jQuery热门功能实现

    非常多站点上都有返回顶部的效果,本文阐述怎样使用jquery实现返回顶部button. 首先须要在顶部加入例如以下html元素: <p id="back-to-top"> ...

  10. visual studio code, asp.net5, mvc6资料汇总

    最近在试探性地跟随微软最新发布的一些产品,现列下某些挺好的文章和链接 code.visualstudio.com http://blogs.msdn.com/b/cesardelatorre/arch ...