day2(12.17):在HTML中使用JavaScript

作者: 留白_汉服vs插画 | 来源:发表于2017-12-16 18:30 被阅读41次

    本章内容:

    使用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和括号引号。如果支持,则不显示标签中的内容。

    相关文章

      网友评论

        本文标题:day2(12.17):在HTML中使用JavaScript

        本文链接:https://www.haomeiwen.com/subject/tdmswxtx.html