HTML加载过程
在地址栏输入url，返回html后，浏览器开始顺序加载并渲染DOM Body标签 当浏览器遇到body标签才算真正开始加载并渲染DOM，此时会有以下几种情况： DOM元素 浏览器遇到dom元素时，正常顺序加载，边加载边渲染 内联CSS 当遇到内联CSS时，浏览器继续加载，但渲染被阻塞，此时会生成新的CSS Rule Tree，生成后重新渲染界面 外联CSS 当遇到外联CSS（link标签），浏览器启一个线程加载css文件，DOM继续加载但渲染被阻塞 内联Javascript 当遇到内联Javascript，浏览器开始执行这段脚本，DOM的加载和渲染同时被阻塞（由于JavaScript有可能会更改DOM Tree和Render Tree，因此同时被阻塞） 外联Javascript 当遇到外联Javascript，浏览器开始下载这段脚本，下载成功后执行它，这整个过程DOM的加载和渲染同时被阻塞 Example 用一个例子解释一下 <html> <body> <h2>Hello</h2> <script> function print(){ console.log('first script', document.querySelectorAll('h2')); } print(); setTimeout(print); </script> <script src="http://cdn