2.5执行和加载脚本的顺序

2.5.1内联脚本

    对于内联脚本而言,它的执行顺序就是从上之下读取页面时遇到javascript脚本的顺序。内联脚本既可以出现在head中,也可以出现在body中。

<html>
    <head>
        <script type="text/javascript">
            alert("test1");
        </script>
    </head>
    <body>
        <h1>Hello World!</h1>
        <script type="text/javascript">
            alert("test2");
        </script>
    </head>
</html>

    在浏览器加载该页面的时候,会先跳出一个显示test1的窗口,点击确定之后浏览器才会继续分析文档的DOM结构,直到遇到第二个脚本块。(alert()会中断javascript代码的执行,并等待用户的处理)

2.5.2外部脚本

    所引用的外部脚本的执行顺序与同一位置的内联脚本代码的执行顺序完全相同。引用外部脚本与内联脚本的唯一区别在于,可能会是加载页面的时间略微延长,因为浏览器需要暂停执行并访问外部网络或文件系统以获得外部脚本文件。对于较大的脚本文件,这种延迟可能比较明显,较小的文件并不存在明显的差异。

2.5.3延迟脚本的执行

    延迟脚本执行的两种情况:

  1. 试图在脚本代码中修改DOM——这需要文档的整个DOM已经存在;
  2. 所引用的外部脚本非常大,或者需要较长时间进行下载。

在上述两种情况下,我们希望对于需要下载的其余页面而言,javascript脚本具有最低的优先级。这样的话,在下载javascript文件的时候,用户就已经可以看到页面中的图片和其他页面的布局。

2.5.4以事件驱动方式执行脚本

    在脚本中包含一个函数,仅当调用该函数的时候,函数中包含的代码才会被执行,因此javascript分析器将解释该脚本代码块,记住该函数但是并不执行任何操作。只有当与该函数绑定的事件发生时,该函数才会被执行。

2.5.5动态加载javascript脚本

2.5.6在URL中执行javascript代码

    可以使用javascript协议,就是将javascript放在url中。浏览器将解释这些javascript代码,并将对这些代码的响应作为文档的源代码。只需在浏览器的地址栏中输入javascript代码,就可以看到效果:javascript:var myRandom = Math.random()*100;document.write("<h1>My Random Number</h1> <p>"+myRandom+"</p>");

    如果希望在某个超链接的URL中执行javascript代码,那么可以使用下述代码:

<a href="javascript:alert('hello world!')">Hello World!</a>

 

posted @ 2013-08-16 11:38  wy2013  阅读(251)  评论(0)    收藏  举报