javascript中含有defer属性在IE下的执行顺序

defer现象描述

 代码如下 复制代码

<HTML><HEAD><TITLE>JavaScript defer attribute test page - tests deferring scripts in browsers</TITLE>
<SCRIPT language=JavaScript type=text/javascript>
  <!--
 var msg = "";
 //-->
  </SCRIPT>

<!-- 这里是内部defer 先暂缓执行,一直往下走-->
<SCRIPT language=JavaScript defer type=text/javascript>
  <!--
 msg += "Inline Head Deferredn";
 //-->
  </SCRIPT>

<!-- 没有defer 最先被执行 -->
<SCRIPT language=JavaScript type=text/javascript>
  <!--
 msg += "Inline Headn";
 //-->
  </SCRIPT>

<!-- 外链defer 肯定是最后执行的-->
<SCRIPT language=JavaScript src="defer.files/extjs1.js" defer
type=text/javascript></SCRIPT>

<!-- head内的外链,无所谓,从上往下被顺序执行,也就是第二个被执行的-->
<SCRIPT language=JavaScript src="defer.files/extjs2.js"
type=text/javascript></SCRIPT>

<BODY class=av>
<!--body 内的defer 先暂缓执行 程序继续往下走-->
<SCRIPT language=JavaScript defer type=text/javascript>
  <!--
 msg += "Inline Body Deferredn";
 //-->
  </SCRIPT>

<!--body内的语句,程序执行到这里,这是第三个被执行的 -->
<SCRIPT language=JavaScript type=text/javascript>
  <!--
 msg += "Inline Bodyn";
 //-->
  </SCRIPT>

<A onclick="alert(msg);return false;"
href="javascript:;">Test Defer Attribute</A>

<!-- 这里面有外链,且有defer,但是上面的defer应该执行了 这个语句接着往下放到head外链defer的下面-->
<SCRIPT language=JavaScript src="defer.files/extjs3.js" defer
type=text/javascript></SCRIPT>

<!-- 这里是外链-->
<SCRIPT language=JavaScript src="defer.files/extjs4.js"
type=text/javascript></SCRIPT>
</BODY></HTML>

其实defer的告诉浏览器读js脚本的时候完全不等脚本开始读下面的代码。然后让js脚本自己读完后在执行defer的脚本。给外链的js脚本添加defer="defer" 或 defer="true",例<script src="javascript.js" type="text/javascript defer="defer"/> 特别是比较大的脚本,提高整个网页的载入速度是非常明显的。

如果不声明defer="defer" 默认是 false

总结:

普通的是边解释,边执行

defer的是网页脚本加载完的后再执行

online 的所有的内容加载完后(包括图片)执行

注意:

defer="true"还可以用作defer="defer",似乎使用defer="defer"比较普遍,我查看一个微软的文档,好像XTHML格式的网页用defer="true"比较恰当。

另外注意,defer="true"这个东西不要在脚本程序段中调用document.write命令,因为将产生直接输出效果

如果不显式声明 defer ,则其默认值 是false

时间: 2024-11-06 12:31:38

javascript中含有defer属性在IE下的执行顺序的相关文章

JavaScript中通过prototype属性共享属性和方法的技巧实例

 这篇文章主要介绍了JavaScript中通过prototype属性共享属性和方法的技巧实例,本文直接给出一个代码实例,需要的朋友可以参考下     具体代码如下:   代码如下: //定义函数 function people(name,sex,age){ this.name = name; this.sex = sex; this.age = age; } //共享isStudent与sayName方法 people.prototype = { isStudent:true, sayName:

javascript中常用坐标属性offset、scroll、client

原文:javascript中常用坐标属性offset.scroll.client      今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. 1.在文档(document)对象里面用: scrollWidth/Height:获取对象的滚动宽度(滚动条可以滚动的宽度,相当于整个页面的总宽度的样子--网页正文全宽) scrollLeft/Top:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离(页面利用滚动条滚动到右边

JavaScript 中 avalon绑定属性总结_javascript技巧

avalon是前端MVVM框架,将所有前端代码彻底分成两部分,视图的处理通过绑定实现(angular有个更炫酷的名词叫指令),业务逻辑则集中在一个个叫VM的对象中处理.我们只要操作VM的数据,它就自然而然地神奇地同步到视图. $model(所有非$属性),$event(事件对象) 1.作用域圈定 ms-controller:按着就近原则自下而上扫描DOM树 ms-important:仅扫描本节点及之下作为扫描区 ms-skip:使绑定失效 2.ms-duplex双向绑定属性:除了绑定(VM同步数

Javascript中的Event属性

altKey, button, cancelBubble, clientX, clientY, ctrlKey, fromElement, keyCode, offsetX, offsetY, propertyName, returnValue, screenX, screenY, shiftKey, srcElement, srcFilter, toElement, type, x, y 1.altKey 描述: 检查alt键的状态. 语法: event.altKey 可能的值: 当alt键按

JavaScript中window对象属性,时间等的总结

Window对象是客户端javascript最高层对象之一,只要打开浏览器窗口,不管该窗口中是否有打开的网页,当遇到BODY.FRAMESET或 FRAME元素时,都会自动建立window对象的实例.另外,该对象的实例也可由window.open()方法创建.由于window对象是其它大部分对象的共同祖先,在调用window对象的方法和属性时,可以省略window对象的引用.例如:window.document.write()可以简写成: document.write(). 在窗口中觖发本窗口对

javascript中的prototype属性使用说明(函数功能扩展)_javascript技巧

这是一个比较特殊的属性,Javascript中的继承一般都依赖这属性实现. 在Javascript中,一切都是对象,字符串是对象,数组是对象,变量是对象,函数也是对象,所以才会允许['a','b','c'].push('d');这样的操作存在.类本身也是一个对象,也可以定义属性和方法: 复制代码 代码如下: function Test(){}; Test.str = 'str'; Test.fun = function(){return 'fun';}; var r1 = Test.str; /

javascript中的prototype属性实例分析说明_javascript技巧

在Javascript中,一切都是对象,字符串是对象,数组是对象,变量是对象,函数也是对象,所以才会允许['a','b','c'].push('d');这样的操作存在.类本身也是一个对象,也可以定义属性和方法: 复制代码 代码如下: function Test(){}; Test.str = 'str'; Test.fun = function(){return 'fun';}; var r1 = Test.str; // str var r2 = Test.fun(); // fun var

浅析JavaScript中的CSS属性及命名规范_javascript技巧

许多CSS样式属性的名字中都有连字符,在JavaScript中,连字符被解释为减号. 因此,CSS2Properties对象的属性名和真正的CSS属性名有点不同. 如果一个CSS属性名含有一个或多个连字符,在JS中则需要删除了连字符,并且原来紧接在连字符后的字母改为大写. 要注意的是float是JS的关键字,所以在JS中float被写作cssFloat与或floatStyle. 下面是CSS自身属性与JavaScript中CSS编码对照表: 盒子标签和属性对照:CodeCSS语法 (不区分大小写

如何在JavaScript中实现私有属性的写类方式(一)_javascript技巧

之前讨论过JavaScript中的写类方式.但没有讨论私有的实现.这篇看下. 我们知道JS中私有属性的实现本质就是 var + closure.如下 复制代码 代码如下: function Person(n, a){     // public     this.name = n;     // private     var age = a;     this.getName = function(){         return this.name;     }     this.getA