2.在HTML中使用JavaScript

1. script元素

向HTML中插入JavaScript的主要方法，就是使用script标签

HTML 4.01为script标签定义了6个属性

• async：可选，表示异步，立即下载脚本，但是不妨碍页面中其它操作。只对外部脚本文件有效
• charset：可选，表示通过src属性指定的代码的字符集。大多数浏览器会忽略他的值
• defer：可选， 表示脚本可以延迟到文档完全被解析之后再执行，只对外部文件有效
• language：已废弃，原用来表示编写代码所使用的脚本语言
• src：可选，表示要执行的代码外部文件
• type：可选，可以看成是language的代替属性，表示编写代码使用的脚本语言的内容类型。默认为 text/javascript

使用script标签的方式：直接在页面中嵌入JavaScript代码和包含外部文件

在使用script标签嵌入JavaScript代码时，需要为该标签指定type属性，然后将JavaScript代码放入即可

在使用嵌入式JavaScript代码时，切忌不要在任何地方出现“script”字符串，因为浏览器会将其解析为结束标签

eg：错误的写法(会报错)

");
    }

eg：正确的写法（通过转义字符转义）

3. 包含在script标签中的代码，将会被从上到下依次解释

2. 标签的位置

按照传统的做法，所有的script标签都要放在页面的head标签中。

这种做法意味着页面要等全部的JavaScript代码都被下载和执行完成以后，才开始呈现页面的内容。这无疑会导致页面页面在加载的时候出现延迟。影响用户体验。为避免这个问题，现代的web应用程序一般把全部的JavaScript放在标签的最后面

    
        
    
    
        //...内容区
        
        
    

3.延迟和异步加载

defer属性：脚本会被延迟到整个页面都解析完成之后再运行，因此，在script标签中设置该属性，等于告诉浏览器，立即下载，延迟执行

async：只适用于外部脚本文件，并告诉浏览器立即下载文件，但是并不保证按照指定它们的先后顺序执行

4.嵌入代码与外部代码的区别

一般认为最好的做法还是尽可能使用外部文件来包含JavaScript代码

外部文件含有如下优点：

• 可维护性强
• 可缓存：如果有两个文件使用同一个JavaScript文件，那么该JavaScript文件只会被加载一次，可以加快页面加载速度
• 适应未来

5.noscript元素

包含noscript的元素只有在以下情况下才会显示出来

• 浏览器不支持脚本
• 浏览器支持脚本，但是脚本被禁用

只有符合以上条件，noscript标签中的内容才会显示出来

这个页面会在脚本无效的情况下向用户展示一条信息。而在启用了脚本的浏览器中，用户永远也不会看到它，即使它是页面的一部分

6. 小结

1. 包含外部的JavaScript文件的时候，script标签必须使用src属性指定外部文件链接
2. 在不使用异步和延迟加载（async，defer）的情况下，所有script标签中的元素都会按照他们在文件中出现的顺序依次依次加载，只有解析完前面的script标签之后，才会解析后面的
3. defer属性可以让脚本在文档完全呈现之后再去执行，延迟脚本总是按照他们的顺序执行
4. async属性可以表示当前脚本不必等待其他脚本，也不必阻塞文档呈现，但是不能保证异步脚本按照他们原来的顺序
5. noscript标签可以指定在不支持脚本的浏览器中显示替代的内容，但是在启用了脚本的浏览器中，浏览器不会显示该标签中的任何内容