JavaScript高级程序设计学习笔记--在HTML中使用javascript

1：<script>元素

使用<script>元素的两种方式：直接在页面中嵌入JavaScript代码和包含外部JavaScript文件。
使用<script>嵌入javascript代码时，只须为<script>指定type属性。

<script type="text/javascrpt>
 function sayHi()
 { 
  alert("Hi!");
 }
<script>

使用<script>嵌入javascript代码时，记住不要在代码中的任何地方出现“</script>”字符串。例如，浏览器加载下面的代码会产生一个错误：

<script type="text/javascrpt>
 function sayScript()
 { 
  alert("</script>");
 }
<script>

应该通过转入字符“\”解决,例如：

<script type="text/javascrpt>
 function sayScript()
 { 
  alert("<\/script>");
 }<script>

加载外部javascript文件，可以像下面那样：

<script type="text/javascrpt" src="example.js"></script>

与解析嵌入式JavaScript代码一样，在解析外部JavaScript文件（包括下载该文件）时，页面的处理也会暂时停止。如果是XHTML文档中，也可以省略结束的</script>标签，例如：

<script type="text/javascrpt" src="example.js">

但是，不能在HTML文档中使用这种语法。原因是这种语法不符合HTML规范，而且也得不到某些浏览器（尤其是IE）的正确解析。

2：标签位置

如果在文档的<head>元素中包含所有的javascript文件，意味着必须等到全部的javascript代码都被下载、解析和执行完成以后，才能开始呈现页面的内容（浏览器在遇到<body>标签时
才开始呈现内容）。这对于那些需要很多javascript代码的页面来说，这无疑会导致浏览器在呈现页面时出现明显的延迟，为了避免这个问题，可以将javascript引用放在<body>元素中
页面内容的后面，如下所示：

<body>
<!-- 这里放内容->
<script type="text/javascrpt" src="example1.js"></script>
<script type="text/javascrpt" src="example2.js"></script>
</body>

3：延迟脚本

HTML4.01为<script>标签定义了defer属性。这个属性的用途是表明脚本在执行时不会影响页面的构造。也就是说，脚本会被延迟到整个页面都解析完毕后再运行。因此，在<script>
元素中设置defer属性，相当于告诉浏览器立即下载，但延迟执行。

<script type="text/javascrpt"　defer="defer" src="example2.js"></script>

4:异步脚本

HTML5为<script>元素定义了async属性。与defer属性类似，都用于改变处理脚本的行为，且只适用于外部文件，并告诉浏览器立即下载文件。但与defer不同的是，标记为async的脚本
并不保证按照指定它们的先后顺序执行。如：

<script type="text/javascrpt"　async src="example2.js"></script>

5 使用外部javascript文件的好处：

1。可以维护性
2。可缓存。
3。适应未来。

6 <noscript>

用于在浏览器不支持javascript时，显示替代的内容。

<body>
<noscript>
<p>本页面需要浏览器(启用)JavaScript</p>
</noscript>
</body>

posted @ 2014-04-26 00:14 Gyoung 阅读(401) 评论(0) 编辑收藏举报

努力加载评论中...

刷新页面返回顶部