zl程序教程

您现在的位置是:首页 >  前端

当前栏目

《JavaScript精粹(修订版)》——1.7 给页面添加脚本

JavaScript 添加 脚本 页面 1.7 修订版 精粹
2023-09-11 14:17:46 时间
解析器本来无需读取注释内容,更不用去执行它。不过现实情况是,被注释的JavaScript完全可以工作,这是一个历史遗留问题,也是一种妥协,不应该假定解析器会正确地略过注释,忽略注释中的JavaScript,实际上,应该假定解析器一定不能正确地读取注释。

本节书摘来自异步社区《JavaScript精粹(修订版)》一书中的第1章,第1.7节,作者:【英】Edwards, J. , 【澳】Adams, C.著,更多章节内容可以访问云栖社区“异步社区”公众号查看

1.7 给页面添加脚本

要想让脚本工作,首先需要在页面中将其载入。有两种技术可以做到这一点,而其中一种技术明显优于另一种。

方 法
第一种,也是最直接的方法,是把代码写入script元素中,正像前面看见过的那样:

 script type="text/javascript" 

function saySomething(message)

 alert(message);

saySomething(Hello world!);

 /script 

这种方法的问题在于,对于老的或者不支持script元素的浏览器,这些内容会被解释为文本。

一种更好的替代方式是将脚本放入外部的一个JavaScript文件,如下:

script type="text/javascript" src="what-is-javascript.js" /script
这条语句会载入一个外部的名叫what-is-javascript.js的JavaScript文件。这个文件中将包含前一个例子放入script元素中的代码,如下:

文件:what-is-javascript.js

function saySomething(message)

 alert(message);

saySomething(Hello world!);

采用这种方法,不支持script元素的浏览器会忽略JavaScript部分,也不会显示多余内容(因为该元素的内容实际上是空的),不过那些能够解读script的浏览器会载入并处理该脚本。这有助于脚本和内容的分离,而且很容易维护,可以在不同的页面中使用同一个脚本,而无须复制脚本,也无需维护多个副本。

讨 论
也许您对避免在页面中写入脚本这个建议有异议,“不会有问题的呀”,您可能还会说,“我可以使用HTML注释把代码框起来”。不过我认为那不是一个好主意,使用HTML注释来“隐藏”代码是一种非常坏的习惯,一定要记住这一点。

1.7.1 用HTML注释框住代码
解析器本来无需读取注释内容,更不用去执行它。不过现实情况是,被注释的JavaScript完全可以工作,这是一个历史遗留问题,也是一种妥协,不应该假定解析器会正确地略过注释,忽略注释中的JavaScript,实际上,应该假定解析器一定不能正确地读取注释。

书中的所有例子都通过HTML提供(与之相对的是XHTML),所以这种假设是合理的。不过如果使用XHTML(使用application/xhtml+xml的MIME类型),在浏览器处理该文件之前,XML解析器能够正确地忽略其中的注释,这样,注释的JavaScript代码确实不会执行。不过,考虑到兼容性(以及良好的编程习惯),强烈建议您尽量不在注释中放入代码。JavaScript代码应该总是放到一个外部的JavaScript文件中。

1.7.2 语言属性
语言属性不再是必需的了。当Netscape 4和它同时代的浏览器成为了主流时, script 标签扮演了一个探测脚本支持的角色(在JavaScript 1.3中指定),并且影响着脚本解释器的工作方式。

当JavaScript变成了ECMAScript时,指定JavaScript的版本已经毫无意义,语言属性已经被类型属性取代。这种属性指定了被包含文件的MIME类型,例如脚本和样式表的类型,而且这也是惟一的一种需要指定的类型:

script type="text/javascript"
实际上,值应该被指定为text/ecmascript,不过Internet Explorer不认识这种信息。我个人希望它最好能支持,因为我输入javascript几个字比较费劲,有好多次,在输入text/javascript的时候我都输错。


HTML中的JavaScript中script元素 动态加载脚本 本文介绍了HTML中JavaScript的动态加载脚本的概念、优势和实现方式,并结合实例讲解了如何通过动态加载脚本实现更加灵活的控制和优化。
HTML中的JavaScript中script元素动态加载脚本 在HTML中, script 元素可以通过动态创建和添加来实现动态加载脚本。动态加载脚本可以优化页面性能和提高用户体验,但需要注意脚本的执行顺序和依赖关系。
HTML中的JavaScript中script元素推迟执行脚本 在HTML中, script 元素可以通过添加defer或async属性来推迟或异步执行JavaScript脚本。这种方式可以优化页面性能和提高用户体验。
异步社区 异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区,也是国内领先的IT专业图书社区,致力于优质学习内容的出版和分享,实现了纸书电子书的同步上架,于2015年8月上线运营。公众号【异步图书】,每日赠送异步新书。