day2(12.17):在HTML中使用JavaScript
本章内容:
使用script元素
嵌入脚本与外部脚本
文档模式对JavaScript的影响
禁用JavaScript的场景
script元素
6个属性:async:可选,立刻下载脚本,但不妨碍页面中其他操作,比如下载其他字眼或等待加载其他脚本。只对外部脚本有效。defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本有效。src:包含言之行的代码的外部文件。type:就是类型的意思,一般是text/javascript。charset、language 忽略。
script的使用方法:
方法1、内:直接在页面中使用script标签,然后在其中写上JavaScript代码。
方法2、外:通过src属性,引用外界的JavaScript代码。所以src可以加载同一服务器上的文件,也可以是其他域的js文件。
注意:方法1中,script代码加载完毕前,页面其余部分不会被浏览器加载或显示,且代码中不用出现</script>,除非加一个\转义。
方法2中,如果是符合XML标准的XHTML文档,可以省略后面的</script>
方法1、2是不能联合使用的。既引用外界的script,又在中间写代码。
只要不存在defer和async,script依次执行。
script标签的位置
一般放在body中的末尾,这是因为页面优化的缘故,如果放在head中,只有先加载完script,并且解析和执行之后,才能加载页面,会有一个空白的时间。用户可能会有点懵逼。但是放在最后就不一样了。马上显示页面。
defer和async(只适用于外部脚本)
defer="defer":立刻下载,但是延迟执行,只有到浏览器遇到</html>之后再执行。两个延迟脚本按顺序执行。
async="async":立刻下载,但是两个延迟脚本的顺序是不一定的。所以最好不要有依赖关系。当前脚本不必等待其他脚本,也不必阻塞文档呈现。
嵌入代码和外部文件
尽可能使用外部文件,因为更容易维护,可缓存,更适用于未来。
文档模式
禁用JavaScript的场景
使用noscript标签,在不支持JavaScript的时候,显示标签中的内容,不管是什么,都直接显示出来。甚至是函数,比如console("王海洋棒棒哒"),也会直接显示函数的内容:console("王海洋棒棒哒"),注意不是只显示“王海洋棒棒哒”几个字,还显示了console和括号引号。如果支持,则不显示标签中的内容。