JS之1-2在HTML中使用JavaScript

2016-12-15 P11

<script>元素：

HTML 4.01为<script>定义了6个属性：

async：表示应该立即下载的脚本，但不应妨碍页面中的其他操作，比如下载其他资料或作等待加载脚本等。
charest：表示通过src属性指定的代码的字符集。（忽略）
defer：表示脚本可以延迟到文档完全被解析和显示之后再执行。（只对外部脚本文件有效）
language：已废弃。
src：表示包含要执行代码的外部文件。
type：表示编写代码使用的脚本语言的内容类型（也称为MIME类型）。type的属性值是text/JavaScript（默认）。

使用<script>元素的方式有两种：①直接在页面中嵌入JavaScript代码②包含外部JavaScript文件。

包含在<script>元素内部的JavaScript代码将被从上而下依次执行。在解释器对<script>元素内部的所有代码求值完毕以前，页面中的其他内容都不会被浏览器加载或显示。

带有src属性（即由外部脚本文件）的<script>元素不应该在其<script>和</script>标签之间在包含额外的JavaScript代码。

通过<script>元素的src属性还可以包含来自外部域的JavaScript文件。

无论如何包含代码，只要不存在defer和anysc属性，浏览器都会按照<script>元素在页面中出现的先后顺序对它们依次进行解析。

<script>标签的位置：

现代Web应用程序一般都把全部JavaScript引用放在<body>元素中页面内容的后面，这样，在解析包含的JavaScript代码之前，页面的内容将完全呈现在浏览器中。

延迟脚本：

使用defer属性可以让脚本在文档完全呈现之后再执行。延迟脚本总是按照指定它们的顺序执行，但先于DOMContentLoaded事件执行。

1 <hesd>
2 
3 <script type="text/javascript" defre="defer" scr="example.js"></script>
4 <script type="text/javascript" defre="defer" scr="example1.js"></script>
5 
6 </head>   //只用于外部文件

异步脚本：

使用anysc属性可以表示当前脚本不必等待其他脚本，也不必阻塞文档呈现。不能保证异步脚本按照它们在页面中出现的顺序执行。

1 1 <hesd>
2 2 
3 3 <script type="text/javascript" anysc scr="example.js"></script>
4 4 <script type="text/javascript" anysc scr="example1.js"></script>
5 5 
6 6 </head>    //只用于外部文件

嵌入代码与外部文件：

外部文件的有点：①可维护性②可缓存③适应未来

文档模式：

①混杂模式②标准模式

如果在文档开始处没有发现文档类型声明，则所有浏览器都会默认开启混杂模式。

对于标准模式，可以通过下面任何一种文档类型来开启：

1 <!--HTML 4.01 严格型>
2 <DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
3 "http://www.w3.org/TR/html4/strict.dtd">

1 <!--HTML 1.0严格型>
2 <DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0strict //EN"
3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<noscript>元素：

可以指定在不支持脚本的浏览器中显示的替换内容。

这个元素可以包含能够出现在文档<body>中的任何HTML元素——<script>元素除外。

包含在<noscript>元素中的内容只有在浏览器不支持脚本或者是浏览器支持脚本但脚本被禁用的情况下，浏览器才会显示<noscript>中的内容，其他情况下不会显示。

1 <body>
2     <noscript>
3        <p>本页面需要浏览器支持（开启）JavaScript.<p>
4     </noscript>
5 <body>