小弟知道在html包含的<script>元素中的js代码
会在body内容加载之前先加载 那如果小弟这样写也是js代码先加载吗?
代码如下(第一种情况)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 </head> 7 <body> 8 //把代码放在Body中 还是一样JS先加载吗? 9 <script> ....</script> 10 </body> 11 </html>
第二种情况
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> //把代码放在Body下面 到底是body的内容先加载呢 还是JS先加载呢? <script> ....</script> </html>
还望大神给小弟科普下 谢谢了
html文档是按顺序加载的,如果把js代码放到 head标签中,那么会先执行js代码,js代码执行完毕后,在继续加载js后面的代码
1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <title></title> 6 <script type="text/javascript"> 7 alert(1);//这里会先alert 在呈现 body 里面的 测试文字 8 </script> 9 </head> 10 <body> 11 测试 12 13 </body> 14 </html>
如果把js代码放到body后面,那么就先呈现 body里面的 测试文字 ,在alert
由上往下,顺序加载。
我曾经测试过,具体的我都忘记了,你可以自己打断点测试一下,加载顺序是不一样的,有三四种情况的,楼上的太片面
除了通过放置<script>标签的位置调整JS加载顺序 外,<script>标签还有两个属性, defer="defer" 和 async ="async "
这两者的区别:
http://stackoverflow.com/questions/5250412/how-exactly-does-script-defer-defer-work