首页 新闻 会员 周边

小弟问个基础问题,html中的js代码加载顺序

0
[已关闭问题] 关闭于 2015-06-26 10:51

小弟知道在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>

 

还望大神给小弟科普下 谢谢了

狂扁小朋友的主页 狂扁小朋友 | 初学一级 | 园豆:10
提问于:2015-06-24 21:58
< >
分享
所有回答(4)
0

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

changsen- | 园豆:29 (初学一级) | 2015-06-24 22:19
0

由上往下,顺序加载。

芝芝07 | 园豆:365 (菜鸟二级) | 2015-06-25 08:34
0

我曾经测试过,具体的我都忘记了,你可以自己打断点测试一下,加载顺序是不一样的,有三四种情况的,楼上的太片面

代码小兵的成长 | 园豆:303 (菜鸟二级) | 2015-06-25 11:05
0

除了通过放置<script>标签的位置调整JS加载顺序 外,<script>标签还有两个属性, defer="defer" 和 async ="async "

这两者的区别: 


http://stackoverflow.com/questions/5250412/how-exactly-does-script-defer-defer-work

傲慢与偏剑 | 园豆:381 (菜鸟二级) | 2015-06-25 12:50
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册