博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript的执行顺序2
阅读量:4683 次
发布时间:2019-06-09

本文共 2385 字,大约阅读时间需要 7 分钟。

测试一:

test.html

                        javascript记载顺序研究                                                
this is just a Test

*.js

alert("1") //1.js alert("2") //2.js alert("3") //3.js

执行结果:在“this is just  a Test出现前,alert()语句依次执行,执行完成后,this is just  a Test 出现”

测试2:

test.html

                        javascript记载顺序研究                                        
this is just a Test

*.js

alert("1") //1.js alert("2") //2.js alert("3") //3.js

执行结果:alert("1")->"this is just a Test 出现"->alert("2")->alert("3")

测试3:

test.html

                        javascript记载顺序研究                                
this is just a Test

a.js

alert("aaa");document.getElementById("container1").innerHTML="aaa";

b.js

alert("bbb");document.getElementById("container1").innerHTML="bbb";

执行结果:alert("aaa")->“运行document.getElementById("container1").innerHTML="aaa"报错,document.getElementById("container1")为空”->alert("bbb")->"运行document.getElementById("container1").innerHTML="bbb"成功"

由一,二,三测试可以看出,在页面中的<script></script>同样会被作为一般的页面元素,按页面顺序加载。与普通DOM不同的是,<script>中的脚本会在加载过程中解释执行。在执行过程中,不能使用未加载的DOM

测试四:

test.html

                        javascript记载顺序研究                                
this is just a Test
Test

a.js

window.οnlοad=function (){    alert("aaa");    document.getElementById("container1").innerHTML="aaa";}

b.js

alert("bbb");document.getElementById("container2").innerHTML="bbb";

执行结果:

alert("bbb");->document.getElementById("container2").innerHTML="bbb";->window.onload()->...

测试四表面:window.onload()函数是在页面元素全部加载后再执行。

测试五:

test.html

                        javascript记载顺序研究                                        
this is just a Test
Test

a.js

window.οnlοad=function (){    alert("aaa");    document.getElementById("container1").innerHTML="aaa";}$(function(){    alert("$aaa");})

测试结果:alert("$aaa")->alert("aa")表明jquery的$(document).ready(function(){})比window.onload先执行。

转载于:https://www.cnblogs.com/limingluzhu/archive/2012/11/29/2794414.html

你可能感兴趣的文章
centos7.3下curl支持https协议
查看>>
ASPCMS 标签
查看>>
《C++ Primer 4th》读书笔记 第12章-类
查看>>
Mac下搭建Apache+PHP+MySql运行环境
查看>>
WCF消息传递
查看>>
测试准入准出标准
查看>>
区块链学习笔记01(基本介绍)
查看>>
[树形dp] 洛谷 P2634 聪聪可可
查看>>
The version of SQL Server in use does not support datatype 'datetime2' 解决办法
查看>>
JAVA基础知识之网络编程——-网络基础(Java的http get和post请求,多线程下载)...
查看>>
DSAPI多功能组件编程应用-HTTP监听服务端与客户端_指令版
查看>>
Java中的ReentrantLock和synchronized两种锁定机制的对比
查看>>
MySQL锁之二:锁相关的配置参数
查看>>
作品汇总和进度表
查看>>
2018-2019-1 20165301 《信息安全系统设计基础》第五周学习总结
查看>>
EF多个表映射
查看>>
J2EE项目集成SAP的BO报表
查看>>
SpringBoot常用属性配置
查看>>
linux sdcv命令
查看>>
BZOJ4836: [Lydsy1704月赛]二元运算【分治FFT】【卡常(没卡过)】
查看>>