知识点
第九周主要学习了JSON的语法和对象创建。
- JSON 是轻量级的文本数据交换格式,独立于语言,具有自我描述性,更易理解。
- JSON 语法规则:JSON 语法是 JavaScript 对象表示语法的子集。数据在名称/值对中;数据由逗号分隔;大括号 {} 保存对象;中括号 [] 保存数组,数组可以包含多个对象。
- JSON 与 XML 的相同之处:JSON 和 XML 数据都是易于理解、有层次的结构、可以被大多数编程语言使用。
- JSON 与 XML 的不同之处:JSON 不需要结束标签、更加简短、读写速度更快、可以使用数组。
- JSON 对象在大括号({})中书写,对象可以包含多个 key/value(键/值)对,key 必须是字符串,value 可以是合法的 JSON 数据类型;JSON 数组在中括号中书写,JSON 中数组值必须是合法的 JSON 数据类型。
- 把 JSON 文本转换为 JavaScript 对象。JSON 最常见的用法之一,是从 web 服务器上读取 JSON 数据,将 JSON 数据转换为 JavaScript 对象,然后在网页中使用该数据。
网页展示
JSON对象的创建
以下为我做的JSON对象创建修改原来文本内容的尝试。
代码
JSON对象的创建
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>lsq的JSON练习</title>
<style>
body{background-color:lightblue;}
</style>
</head>
<body>
<h1>JSON对象创建</h1>
<p>第一个修改前的网站名称: <span id="namea1"></span></p>
<p>第一个修改后的网站名称: <span id="namea2"></span></p>
<p>第二个修改前的网站名称: <span id="namea3"></span></p>
<p>第二个修改后的网站名称: <span id="namea4"></span></p>
<script>
var sites = [
{"name":"baidu","url":"www.baidu.com" },
{"name":"BiliBili","url":"www.bilibili.com"},
];
document.getElementById("namea1").innerHTML=sites[0].name;
document.getElementById("namea3").innerHTML=sites[1].name;
sites[0].name="百度一下";
sites[1].name="哔哩哔哩";
document.getElementById("namea2").innerHTML=sites[0].name;
document.getElementById("namea4").innerHTML=sites[1].name;
</script>
</body>
</html>