javascript执行顺序
2014-07-29 18:03:33
阅读1801次
1、代码块
JS是按照代码块来进行编译和执行的，代码块间相互独立，但变量和方法共享。
举个例子：
<script type="text/javascript">
alert(str);//因为没有定义str，所以浏览器会出错，下面的不能运行
alert("我是代码块一");//没有运行到这里
var test = "我是代码块一变量";
</script>
<script type="text/javascript">
alert("我是代码块二"); //这里有运行到
alert(test); //弹出"我是代码块一变量"
</script>上面的代码中代码块一中运行报错，但不影响代码块二的执行，这就是代码块间的独立性，而代码块二中能调用到代码一中的变量，则是块间共享性。
2、声明式函数与赋值式函数
JS中的函数定义分为两种：声明式函数与赋值式函数。
<script type="text/javascript">
function Fn(){ //声明式函数
}
var Fn = function{ //赋值式函数
}
</script>声明式函数与赋值式函数的区别在于：在JS的预编译期，声明式函数将会先被提取出来，然后才按顺序执行js代码。
3、代码执行顺序
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test js</title>
<script type="text/javascript">
alert("<head>标签中第一个内置js代码段，位于链接js的前面。");
</script>
<script type="text/javascript" src="a1.js"></script>
<script type="text/javascript" src="a2.js"></script>
<script type="text/javascript">
alert("<head>标签中第二个内置js代码段，位于链接js的后面。");
</script>
</head>
<body onload="b()">
<script defer>
alert("defer中的代码段。");
</script>
<script>
alert("body 中的 js 代码段。");
</script>
<script>
function b(){
alert("b函数中的js代码段。");
}
</script>
<script>
alert("body 中的第二个 js 代码段。");
</script>
</body>
<script>
alert("body 之外的 js 代码段。");
</script>
</html>
<script>
alert("html 之外的 js 代码段。");
</script>1.首先执行<head>标签中的js，不论是内置还是外链形式，都是按照出现的顺序执行。
2.接着执行body中的脚本，按顺序直到<html>标签外。
3.然后执行defer="defer"的脚本。（IE中测试支持，chrome和firefox都不支持defer属性，在这两个浏览器中，将作为正常的脚本段按顺序执行）。
4.最后执行body的onload方法。
-----------------------------------------------------
转载请注明来源此处
原地址：#
发表