相关文章
企通互联网页制作学习：页面控制常见问题及解决办法
网站制作用Photoshop为信封盖上奥运中国印
网页设计让你的主页声色并茂—巧为网页添加背景音乐
北京网页设计网页设计经验谈：如何让网页更整洁
北京网站建设FrontPage设计网页如何禁用JavaScript
网页设计Fireworks Eyecandy滤镜效果
网页设计译稿：网站设计之合理架构css
企通互联使用自定义HTML标签来进行网页设计
北京网站设计创建自定义代码片段 提高CSS布局开发效率
网站制作VBScript教程 第十二课
品牌理念
北京网站建设最佳合作伙伴
北京网站建设专家企通互联
竭诚为您提供网站建设服务!
友好连接
文章搜索
你的位置：首页 >> 网页设计 >> 北京网站制作北京网站建设Javascript在网页页面加载时的执行顺序
北京网站制作北京网站建设Javascript在网页页面加载时的执行顺序
一、在HTML中嵌入Javasript的方法
1、直接在Javascript代码放在标记对<script>和</script>之间
2、由<script />标记的src属性制定外部的js文件 Www^Chinaz^com
3、放在事件处理程序中，比如：<p onclick="alert('我是由onclick事件执行的Javascript')">点击我</p>
Www^Chinaz^com
4、作为URL的主体，这个URL使用特殊的Javascript：协议，比如：<a href="javascript:alert('我是网站建设
由 北京网页设计javascript:协议执行的javascript')">点击我</a> Chinaz.com
5、利用javascript本身的document.write()方法写入新的javascript代码
站长.站
6、利用Ajax异步获取javascript代码，然后执行 中.国站长站
第3种和第4种方法写入的Javascript需要触发才能执行，所以除非特别设置，否则页面加载时不会执行。
二、Javascript在页面的执行顺序 中国站.长站
1、页面上的Javascript代码是HTML文档的一部分，所以Javascript在页面装载时执行的顺序就是其引入标记<script />的出现顺序， <script />标记里面的或者通过src引入的外部JS，都是按照其语句出现的顺序执行，而且执行过程是文档装载的一部分。
2、每个脚本定义的全局变量和函数，都可以被后面执行的脚本所调用。 中国.站.长站
3、变量的调用，必须是前面已经声明，否则获取的变量值是undefined。 Chinaz~com
<script type="text/javscrpt">//<![CDATA[北京网页设计
alert(tmp); //输出 undefined网站建设
var tmp = 1;网站制作
alert(tmp); //输出 1北京网站建设
//]]></script>
Www_Chinaz_com
4、同一段脚本，函数定义可以出现在函数调用的后面，但是如果是分别在两段代码，且函数调用在第一段代码中，则会报函数未定义错误。 Www@Chinaz@com
<script type="text/javscrpt">//<![CDATA[北京网站设计
aa(); //浏览器报错网站设计
//]]></script>企通互联
<script type="text/javscrpt">//<![CDATA[北京网页设计
aa(); //输出 1 北京网站设计
function aa(){alert(1);}网站设计
//]]></script> 站长.站
5、document.write()会把输出写入到脚本文档所在的位置，浏览器解析完documemt.write()所在文档内容后，继续解析document.write()输出的内容，然后在继续解析HTML文档。
<script type="text/javascript">//<![CDATA[北京网站建设
document.write('<script type="text/javascript" src="test.js"><\/script>');企通互联
document.write('<script type="text/javascript">');企通互联
document.write('alert(2);')北京网页设计
document.write('alert("我是" + tmpStr);');企通互联
document.write('<\/script>');北京网站建设
//]]></script>企通互联
<script type="text/javascript">//<![CDATA[网站建设
alert(3);网站设计
//]]></script>北京网站建设
test.js的内容是： 网页设计中国.站长站
var tmpStr = 1;企通互联
alert(tmpStr); Chinaz~com
在Firefox和Opera中的弹出值的顺序是：1、2、我是1、3 Www@Chinaz@com
在IE中弹出值的顺序是：2、1、3，同时浏览器报错：tmpStr未定义 Www~Chinaz~com
原因可能是IE在document.write时，并未等待加载SRC中的Javascript代码完毕后，才执行下一行，所以导致2先弹出，并且执行到document.write(’document.write("我是" + tmpStr)’)调用tmpStr时，tmpStr并未定义，从而报错。
站.长站
解决这个问题，可以利用HTML解析是解析完一个HTML标签，再执行下一个的原理，把代码拆分来实现：
Www@Chinaz@com
<script type="text/javascript">//<![CDATA[网站制作
document.write('<script type="text/javascript" src="test.js"><\/script>');北京网站建设 北京网站制作
//]]></script>网站设计
<script type="text/javascript">//<![CDATA[北京网站设计
document.write('<script type="text/javascript">');网页设计
document.write('alert(2);')北京网站制作
document.write('alert("我是" + tmpStr);');网站建设
document.write('<\/script>');北京网站制作
//]]></script>网站建设
<script type="text/javascript">//<![CDATA[网站建设
alert(3);网站制作
//]]></script> 网站制作中国.站.长站
这样IE下和其他浏览器输出值的顺序都是一直的了：1、2、我是1、3。 Www^Chinaz^com
三、如何改变Javascript在页面的执行顺序 中国站.长.站
1、利用onload 中国.站.长站
<script type="text/javascript">//<![CDATA[北京网站建设
window.onload = f;北京网站设计
function f(){alert(1);}网站制作
alert(2);北京网站制作
//]]></script> 站长.站
输出值顺序是 2、1 北京网站设计。
需要注意的是，如果存在多个winodws.onload的话，只有最有一个生效，解决这个办法是：
站.长站
window.onload = function(){f();f1();f2();.....}
利用2级DOM事件类型 中国站.长.站
if(document.addEventListener){网页设计
window.addEventListener('load',f,false);北京网站制作
window.addEventListener('load',f1,false);网页设计
...网页设计
}else{网站设计
window.attachEvent('onload',f);北京网站建设
window.attachEvent('onload',f1);北京网站建设
...北京网站建设
}
中.国.站.长.站
2、IE中可以利用deferdefer作用是把代码加载下来，并不立即执行，等文档装载完毕之后再执行，有点类似onload，但是没有onload那样的局限性，可以重复使用，但是只在IE中有效，所以上面的例子可以修改成为
<script type="text/javascript">//<![CDATA[网站设计
document.write('<script type="text/javascript" src="test.js"><\/script>');网页设计
document.write('<script type="text/javascript" defer="defer">');网站制作
document.write('alert(2);')北京网站设计
document.write('alert(" 企通互联我是" + tmpStr);');北京网页设计
document.write('<\/script>');北京网页设计
//]]></script>网站制作
<script type="text/javascript">//<![CDATA[ www.qitongnet.com北京网页设计
alert(3);北京网站设计
//]]></script>
这样IE就不报错了，输出值的顺序变成：1、3、2、我是1 中国.站.长站
3、利用Ajax。 站.长.站
因为xmlhttpRequest 网站设计能判断外部文档加载的状态，所以能够改变代码的加载顺序。
