Script标签解析

HTML4.01为Script定义了以下属性

async:表示异步下载脚本。只对外部脚本有效

defer:脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本有效,IE7及更早的版本对齐也支持该属性。

src:表示包含的外部脚本文件

type:表示编写代码使用的脚本语言类型(Mime类型),默认值为text/javascript

这里有几点要注意的:

1.带有src属性的script元素不应该在其标签之间再包含额外的JavaScript代码,因为它会被忽略。。

2.外部JavaScript可以包含任意后缀的文件,这样一来,使用ASP,PHP等后端语言动态生成JavaScript也成为了可能,服务器只要返回正确的Mime类型即可,以下是ASP.NET的服务器和前端代码:

<script src="RequestHandler.ashx?action=GetJS">
</script>
        public void GetJS(HttpContext context)
        {
            context.Response.ContentType = "text/javascript";
            context.Response.Write(@"function Hello()
            {
                alert(""hello world"");
            }");
        }

3.Src属性还能包含外部域的JavaScript文件。因此在访问自己控制的服务器上面的JavaScript文件时则要多加小心。

4.无论如何包含代码,只要不存在defer和async属性,浏览器都会按照<script>元素在页面中出现的先后顺序对他们依次解析。

 

按照惯例,所有<script>元素都应该放到<head>元素中,这种做法的目的是把所有的外部资源文件的引用放到相同的地方。可是在文档的<head>元素中包含所有的JavaScript文件,意味着必须等到全部JavaScript元素代码被下载,解析和执行完之后,才能开始呈现页面的内容(浏览器在遇到body标签时才开始呈现内容)。对于那些需要很多JavaScript代码的页面来说,这无疑会导致呈现页面时会出现明显的延迟,浏览器窗口会出现一片空白。为了解决这个问题,现代Web应用程序一般会把全部JavaScript引用放在<body>元素中的页面的内容后面。

延迟脚本

HTML4.01为<script>标签定义了defer属性。这个属性的用途是表明脚本在执行时不会影响页面的构造。也就是说,脚本会被延迟到整个页面都解析完毕后再运行。也就是说不管script元素放到哪里,它都会在浏览器遇到</html>标签后再执行。在现实当中,延迟脚本并不一定会按照顺序执行,因此最好一个页面只有一个延迟脚本

异步脚本

HTML5为<script>元素定义了async属性。标记为async 的脚本并不保证按照指定它们的先后顺序执行,因此要确保两个文件直接互不依赖。指定async属性的目的是不让页面等待两个脚本下载和执行,从而异步加载页面其他内容。为此,建议异步脚本不要在加载期间修改DOM。

 

想学习更多关于JavaScript方面的资料,在这里推荐《JavaScript高级程序设计》这一本书~

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值