首页 > 代码库 > 学习笔记(-)在html中使用javascript
学习笔记(-)在html中使用javascript
1.<script>标签使用
在HTML页面中插入JavScript的主要方法,是使用<script>标签。脚本可位于 HTML 的 <body> 或 <head> 部分中,或者同时存在于两个部分中。
在文档的<head>元素中包含的所有的JavScript脚本,意味着必须等到全部的JavScript代码都被下载,解析和执行完成以后,才能开始呈现页面的内容。因此会导致浏览器在呈现页面时出现明显的延迟,而延迟期间的浏览器窗口中将是一片空白,因此JavScript脚本应放在 <body> 元素中页面的内容后面。这样,在解析JavScript代码之前,页面的内容将完全呈现在浏览器中,用户也会因浏览器窗口显示空白页面的时间缩短而感到页面打开的速度加快。
当包含多个<script>标签时,会按照<script>标签在页面中出现的先后顺序对他们依次进行解析。
使用<script>标签的方式有两种:直接在页面嵌入JavaScript代码和包含外部JavaScript代码
把脚本保存到外部文件中,外部 JavaScript 文件的文件扩展名是 .js。如需使用外部文件,请在 <script> 标签的 "src" 属性中设置该 .js 文件:
<script src="http://www.mamicode.com/myScript.js"></script>
2.<script> 标签的defer 属性:
使用defer=‘defer‘ 属性,脚本会被延迟到整个页面都执行完毕后再运行,延迟脚本总是按照指定他们的顺序执行的,第一个演出的脚本会先于第二个延迟脚本执行。defer 属性只适用于外部脚本文件。
3.<script> 标签的async属性:
async属性也只适用于外部脚本文件,指定async属性的目的是不让页面等待脚本的下载和执行,从而异步的加载页面其它内容。但是不能保证异步脚本按照他们在页面中执行的顺序执行。
4.文档模式
文档模式:HTML文档模式是通过使用文档类型DOCTYPE来指定的。DOCTYPE是Document Type(文档类型)的简写,在页面中,用来指定页面所使用的XHTML(或者HTML)的版本。目前文档模式有三种:混杂模式(quirks mode)、标准模式(standards mode)和准标准模式。对于准标准模式,一般又是通过过渡型(transitional)和框架集型(frameset)来触发。
准标准模式下很对特性都会按照浏览器标准去解析(当然,不是所有),文档开始处如果没有发现文档类型声明,则默认是混杂模式。混杂模式不值得推荐,目前大部分网站用的都是标准模式。
在Html5中,对于文档类型已经统一,直接写法是<!DOCTYPE html>即可。
触发标准模式:
<!-- HTML 4.01 严格型 -->
<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- XHTML 1.0 严格型 -->
<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
触发准标准模式:
<!-- HTML 4.01 过渡型 -->
<!DOCTYPE HTMLPUBLIC "-//W3C//DTD HTML 4.01Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- HTML 4.01 框架集型 -->
<!DOCTYPE HTMLPUBLIC "-//W3C//DTD HTML 4.01Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<!-- XHTML 1.0 过渡型 -->
<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- XHTML 1.0 框架集型 -->
<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
5.<noscript> 元素
<noscript> 元素用来定义在脚本未被执行时的替代内容(文本)。如果浏览器支持脚本,那么它不会显示出 noscript 元素中的文本。
学习笔记(-)在html中使用javascript