我想知道是否有任何可用资源来描述浏览器光标如何执行 Javascript。
我知道它会在页面加载时加载并执行标签,并且您可以将函数附加到各种窗口事件,但事情变得模糊的是,例如,我通过 AJAX 检索远程页面并将其内容放入 div 中。
如果该远程页面必须加载脚本库,例如<script src="anotherscript.js" />
,“anotherscript.js”何时被加载并且其内容被执行?
如果我在当前页面上包含“anotherscript.js”,然后加载一些重复包含此脚本的远程内容,会发生什么情况?会覆盖原来的吗?如果原始的“anotherscript.js”中有一个 var,其值被我更改了,然后我重新加载该文件怎么办...我会丢失原始值还是忽略该脚本的第二次包含?
如果我通过 AJAX 加载一些程序性 Javascript,它什么时候执行?我这样做后立即mydiv.innerHTML(remoteContent)
?或者是在那之前执行的?
答案会有所不同,具体取决于脚本标记的位置以及添加方式:
与标记内联的脚本标记与浏览器对该标记的处理同步执行(参见 #2 除外),因此,例如,如果这些标记引用外部文件,它们往往会减慢页面的处理速度。 (这样浏览器就可以处理document.write
语句,这会改变它们正在处理的标记。)
脚本标签带有defer
在某些浏览器上,属性可能要等到 DOM 完全呈现后才会执行。这些自然不能用document.write
。 (同样还有一个async
使脚本异步的属性,但我不太了解它或它的支持程度;details.)
在 DOM 加载后分配给元素的内容中的脚本标签(通过innerHTML
和类似的)根本不执行,除非您使用 jQuery 或 Prototype 等库来为您执行此操作。(除了 Andy E 指出的一个例外:在 IE 上,如果他们有defer
属性,它将执行它们。不适用于其他浏览器。)
如果您附加一个实际的script
元素通过Element#appendChild,浏览器立即开始下载该脚本,并在下载完成后立即执行它。以这种方式添加的脚本不会同步执行或不一定按顺序执行。首先附加一个<script type="text/javascript" src="MyFct.js"></script>
,然后附加<script type="text/javascript">myFunction();</script>
很可能会在远程(第一个)之前执行内联(第二个)。如果发生这种情况并且MyFct.js
宣称myFunction()
,当我们尝试将它与内联脚本一起使用时,它不会被定义。如果您需要按顺序完成工作,您可以通过观察远程脚本何时加载load
and readyStateChange
上的事件script
您添加的元素(load
是大多数浏览器上的事件,readyStateChange
在某些版本的 IE 上,某些浏览器同时执行这两种操作,因此您必须处理同一脚本的多个通知)。
属性上的事件处理程序内的脚本(<a href='#' onclick='myNiftyJavaScript();'>
) 而不是在相关事件发生时执行脚本标记。
我正在忙于我的真正工作,突然我的后脑说:“你知道,你一直在told如果您将它们分配给它们,它们将不会被执行innerHTML
,但是你亲自检查过吗?”我没有,所以我做了——FWIW:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>Script Test Page</title>
<style type='text/css'>
body {
font-family: sans-serif;
}
</style>
<script type='text/javascript'>
function addScript()
{
var str, div;
div = document.getElementById('target');
str = "Content added<" + "script type='text/javascript'>alert('hi there')<" + "/" + "script>";
alert("About to add:" + str);
div.innerHTML = str;
alert("Done adding script");
}
</script>
</head>
<body><div>
<input type='button' value='Go' onclick='addScript();'>
<div id='target'></div>
</div></body>
</html>
脚本中的警报不会出现在 IE7、FF3.6 或 Chrome4 上(我没有费心去检查其他的,我本来就是要工作的:-))。而如果您如图所示附加元素here,脚本被执行。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)