一、script元素属性:
向html元素插入js代码就必须得有script元素,这其中有两个属性比较常用到:async、defer、src
1.async:可选,表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或其他待加载的脚本。只对外部文件有效。
2.defer:可选,表示脚本可以延迟到文档被完全解析和显示之后再执行。只对外部脚本文件有效。IE7及更早版本对嵌入脚本也支持这个属性。
3.其余的属性还有charset、language(已废弃)、type、ecmascript、text/javascript(默认,不指定也可以),其中charset用于通过src属性指定的字符集,一般浏览器会忽略,不建议使用。
二、js引用方式:
js代码的解释顺序是从上至下依次解释的。解释器对script元素内部的所有代码求值完毕以前,页面中的其余内容都不会被浏览器加载或显示
1.直接嵌入:
在script元素中嵌入代码时,要注意代码内部不能出现</script>,因为浏览器遇到 这个字符的时候,就会以为 遇到结束标签,要想解决这个问题,就需要转义字符“”
比如:
<script type="text/javascript"> function sayScript(){ alert("</script>") } </script>
2.外部包含:
要引入外部文件,那么src属性就是必须的,语法如下:
<script type="text/javascript" src="example.js"></script>
注:在xhtml中,省略结束标签,但在html中,这不符合规范;另外,如果在引入外部js文件的script元素中还有js代码,继续执行外部文件中的js,忽略直接嵌入的js
三、js引用位置
一般我们选择把js放在head标签内部,但这意味着我们必须要等待js加载,执行完毕之后,才能加载页面。这样对用户的体验会大打折扣
1.延迟脚本defer,在script属性中设置该属性的时候,就告诉了浏览器,这个脚本立即下载,但延迟执行。要注意的是,这个延迟脚本最好只有一个,因为延迟脚本之间的执行顺序是不确定的
2.异步脚本async ,该脚本可以让浏览器同时加载脚本以及页面其他内容,因此,建议异步脚本当中不要包含有加载期间修改dom的脚本
四、XHTML
可扩展超文本标记语言,即XHTML,是将HTML作为XML的应用而重新定义的一个标准。XHTML的语法,比HTML要严格得多
因为现在多使用HTMl5。所以,XHTML的用法在此处省略