1.延迟脚本defer

　　在<script>元素中设置defer属性，相当于告诉浏览器立即下载，但是延迟执行。<script>中的脚本会延迟到浏览器遇到</html>标签后再执行。

注：

　　（1）html5规范要求脚本按照它们出现的先后顺序执行，因此第一个延迟脚本会先于第二个延迟脚本执行，而这两个脚本会先于DOMContentLoaded事件执行。

　　在现实当中，延迟脚本并不一定会按照顺序执行，也不一定会在DOMContentLoaded事件触发前执行，因此最好只包含一个延迟脚本。

　　（2）html5规定，defer属性只适用于外部脚本文件，因此html会忽略给嵌入脚本设置defer属性。

　　ie4~ie7还支持对嵌入脚本的defer属性，但是ie8开始则完全支持html5的规范。

　　（3）有些浏览器会忽略defer属性，像平常一样处理脚本，为此，把延迟脚本放在页面的底部仍然是最佳的选择。

2.异步脚本async

　　async属性可以不让页面等待脚本的下载和执行，从而异步加载页面的其他内容。为此，建议异步脚本不要在加载期间修改DOM。

注：

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

　　异步脚本一定会在页面的load事件前执行，但可能会在DOMContentLoaded事件触发之前或之后执行。

3.在XHTML（Extensible HyperText Markup Language）中的用法比html严格很多。

eg：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Test</title>

     <script type="text/javascript">

      function compare(a,b){

          if(a <b){

              alert("A is less than B");

          }

          else if(a > b){

              alert("A is greater than B");

          }

          else{

              alert("A is equal to B");

          }

      }

 </script>

 </head>

 <body>

     <button type="button" onclick="compare(3,10)">Try it</button>

 </body>

 </html>

运行结果：

　

同样的代码在xhtml中是无效的，结果如下：

　　因为比较语句a < b中的小于号“<”号在xhtml中将被当做开始一个新标签来解析。但是作为标签来讲，小于号后面不能跟空格，因此导致语法错误。

P15~P17内容后续理解。

JS_高程2.在HTML中使用Javascript（2）的更多相关文章

  1. JS_高程2.在HTML中使用Javascript（1）

    1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...

  2. JS高程2.在HTML中使用Javascript（1）

    1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...

  3. JS高程2.在HTML中使用Javascript（2）

    1.延迟脚本defer 在<script>元素中设置defer属性,相当于告诉浏览器立即下载,但是延迟执行.<script>中的脚本会延迟到浏览器遇到</html> ...

  4. JavaScript高级程序设计-(1)html中使用JavaScript

    html中使用JavaScript 1.延迟脚本 script标签定义了defer属性,脚本会被延迟到整个页面都解析完毕后运行 详细内容如下: 2.异步脚本 script标签定义了async属性,as ...

  5. 在HTML中使用JavaScript元素

    script属性<script async = async charset="utf-8" defer="defer" src="index.h ...

  6. 2在HTML中使用JavaScript

    像HTML页面中插入JavaScrip的主要方法,就是使用<script>元素.HTML4.01为<script>定义了6个属性:async:可选,表示应该立即下载脚本,当不妨 ...

  7. javascript高级编程3第二章：在html中使用javascript

    2.1 <script>元素 向html页面中插入javascript的主要方法,就是使用<script>元素.这个元素被加入到正式的html规范中.html4.01为< ...

  8. 在Swift中使用JavaScript的方法和技巧

    本文作者Nate Cook是一位独立的Web及移动应用开发者,是继Mattt大神之后NSHipster的主要维护者,也是非常知名活跃的Swift博主,并且还是支持自动生成Swift在线文档的Swift ...

  9. js002-在HTML中使用JavaScript

    js002-在HTML中使用JavaScript 2.1            <script>元素   定义了以下6个属性   async: 可选.表示应该立即下载脚本,但不妨碍页面中的 ...

随机推荐

  1. Sway

    啥是Sway: http://livesino.net/archives/7520.live 地址:http://sway.com 现在又可以申请了   试试效果

  2. [转] whistle--全新的跨平台web调试工具

    whistle是基于Node实现的跨平台web调试代理工具,类似的工具有Windows平台上的Fiddler+Willow,基于Java实现的Charles,及公司同事基于Node实现的Livepoo ...

  3. Spring MVC基础知识整理➣拦截器和自定义注解

    概述 Spring MVC中通过注解来对方法或者类进行动态的说明或者标注,类似于配置标识文件的属性信息.当标注的类或者方式被使用时候,通过提取注解信息来达到对类的动态处理.在 MVC中,我们常用的注解 ...

  4. Python_xml

    xml: 可扩展标记语言,用来标记数据,定义数据类型,主要用来传输和存储数据(和json差不多,不同语言或程序之间进行数据交换的协议) ET(xml.etree.ElementTree)中的几个类: ...

  5. JMeter非GUI模式下日志介绍

    Creating summariser <summary> Created the tree successfully using /opt/JMeter/TestPlan/test.jm ...

  6. Linux 记录所有用户登录和操作的详细日志

    1.起因 最近Linux服务器上一些文件呗篡改,想追查已经查不到记录了,所以得想个办法记录下所有用户的操作记录. 一般大家通常会采用history来记录,但是history有个缺陷就是默认是1000行 ...

  7. CodeForces 516C Drazil and Park 线段树

    原文链接http://www.cnblogs.com/zhouzhendong/p/8990745.html 题目传送门 - CodeForces 516C 题意 在一个环上,有$n$棵树. 给出每一 ...

  8. DateFormat抽象类实现日期与字符串的转换

    [需求]日期是可以计算的,而日期字符串无法计算. 由于DateFormat是抽象类,我们一般都是用的它的子类SimpleDateFormat. [SimpleDateFormat构造方法] 1)Sim ...

  9. Scala-Unit5-Scala面对对象与模式匹配

    Java中的面向对象:万物皆对象. 我们要封装数据,定义模板等操作,素以我们需要面向对象. ====================================================== ...

  10. Scala-Unit-1-概述及安装

    一.Scala简介 官网:www.scala-lang.org Scala语言很强大,它集成了面对对象和函数式编程的特点,并且运行在JVM(Java Virtual Machine)上,即必须安装jd ...