JavaScript代码执行--下篇

版权声明：版权所有-江西服装学院 https://blog.csdn.net/qq_38263696/article/details/83928094

客户端JS时间线

1. Web浏览器创建Document对象,并且开始解析Web页面,解析HTML元素和他们的文本内容后添加Element对象和Text节点到文档中.document.readystate属性的值是"loading"
2. 当HTML解析器遇到没有async和defer属性的script元素时,她把这些元素添加到文档中，然后执行行内或外部脚本.这些脚本就可以用document.write()来吧文本插入到输入流中.
3. 当解析器遇到设置了async属性的script元素时，她开始下载脚本文本,并继续解析文档.脚本会在它下载完成后尽快执行,但是解析器没有停下来等他下载.她们可以看到自己的script元素和它之前的所有文档内容.
4. 当文档解析完毕,document.readyState属性变成"interactive"
5. 所有defer脚本，会按他们在文档里的出现顺序这些.异步脚本可能也会在这个时间执行.延迟脚本能访问完整的文档树.
6. 浏览器在Document对象上触发DOMContentLoaded时间.这标志程序执行从同步脚本执行阶段转到异步事件驱动阶段.异步脚本可 能还没有执行完毕
7. 这是，文档已经完全解析完成.，但是浏览器可能还在等待其他内容载入，如图片.当所有这些内容完成,并且所有脚本完成载入和执行.document.readyState属性改变为"complete",Web浏览器触发Window对象上的load事件
8. 从此刻起,会调用异步事件,以异步响应用户输入事件,网络事件,计算器过期等.

<script>
     console.log(document.readyState);//"loading"
    document.addEventListener("readystatechange",test);
	function jsStart(){
		console.log(this.readyState);
	}// "interactive" , "complete";
	
	//当document.readyState 为"interactive", 就可以用js操作dom元素,
	$(function(){console.log(this.readyState)});//js代码...});
</script>