1.xml
XML文档中的数据采用元素像 HTML 的段落一样展现。
<?xml version="1.0"?>
<!-- XML demonstration -->
<?xml-stylesheet type="text/css" href="style9.css"?>
<!DOCTYPE planet>
<planet>
<ocean>
<name>Arctic</name>
<area>13,000</area>
<depth>1,200</depth>
</ocean>
</planet>
2.json
JSON 是一种语法,用来序列化对象、数组、数值、字符串、布尔值和 null
。它基于 JavaScript 语法,但与之不同:JavaScript不是JSON,JSON也不是JavaScript。JSON最常用的格式是对象的 键值对。例如下面这样:
{"firstName": "Brett", "lastName": "McLaughlin"}
和普通的 JS 数组一样,JSON 表示数组的方式也是使用方括号 []。
{
"people":[{
"firstName": "Brett",
"lastName":"McLaughlin"
},
{
"firstName":"Jason",
"lastName":"Hunter"
}]
}
在跟后台进行数据交互的时候得到一个json字符串。
-
JSON.parse(text[, reviver])
方法用来解析JSON字符串,构造由字符串描述的JavaScript值或对象。提供可选的reviver函数用以在返回之前对所得到的对象执行变换(操作)。
-
text
:要被解析成JavaScript值的字符串,查看 JSON
对象学习的JSON 语法的说明。
-
reviver
(可选):如果是一个函数,则规定了原始值如何被解析改造,在被返回之前。
返回值:Object
对应给定的JSON文本。
-
JSON.stringify(value[, replacer [, space]])
返回与指定值对应的JSON字符串,可以通过额外的参数, 控制仅包含某些属性, 或者以自定义方法来替换某些key对应的属性值。
-
value
:将要序列化成 一个JSON 字符串的值。
-
replacer
(可选):如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;如果该参数为null或者未提供,则对象所有的属性都会被序列化。
-
space
(可选):指定缩进用的空白字符串,用于美化输出(pretty-print);如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格;如果该参数为字符串(字符串的前十个字母),该字符串将被作为空格;如果该参数没有提供(或者为null)将没有空格。
-
返回值 :一个表示给定值的JSON字符串。
3.js的异步加载 defer、async属性以及JS异步加载并执行解决方案;
-
先要创建document文档开始解析web页面,解析HTML和他们的文本内容后添加到Element对象和Text节点到文档中。这个阶段document.readyState = "loading".加载domTree css 才能开始加载js。
-
如果没有defer、async会同步加载,阻塞整个页面,等待js脚本加载完成并执行脚本,然后继续解析文档。
-
如果有defer、async,浏览器会创建线程异步加载js,并且解析文档,不会阻碍文档的解析。对于async属性的script脚本加载完以后会立即执行。(异步加载的js里面禁止写document.write()因为,执行这个文档会把整个文档流清空会用它里边的文档去代替)
<div style="height:100px;width:100px;background:red;"></div>
<script>
document.onload=function(){
document.write('a')
}
</script>
这样页面只能输出一个 a
这是异步加载js的一个形式,就是比较复杂,传了一个回调函数,也可以更改一下传一个数组,执行一系列的方法。
function loadScript(url,callback){
var script = document.createElement('script');
script.type = "text/javascript";
if(script.readyState){
script.onreadystatechange = function(){
if(script.readyState == "complete"||script.readyState == "loaded"){
tools[callback]();
}
}
}else{
script.onload=function(){
tools[callback]();
}
}
script.src = url;
document.head.appendChild(script);
}
loadScript('dome.js',"test")