什么时候浏览器中执行JavaScript？如何执行光标移动？ [英] When does the browser execute Javascript? How does the execution cursor move?

问题描述

我在想，如果有，描述了如何在浏览器的游标执行Javascript的任何可用的资源。

I was wondering if there are any available resources that describe how a browser's cursor executes Javascript.

我知道它加载并执行代码时，页面加载，并且可以附加功能，以不同的窗口事件，但如果事情变得模糊的时候，比如说，我检索通过AJAX远程页面，并把它的内容进入DIV。

I know it loads and executes tags when a page loads, and that you can attach functions to various window events, but where things get fuzzy is when, for instance, I retrieve a remote page via AJAX and put its contents into a div.

如果远程网页已经得到了加载脚本库，如＆LT;脚本SRC =anotherscript.js/＆GT; ，当是anotherscript.js是装和其内容正在执行？

If that remote page has got to load script libraries such as <script src="anotherscript.js" />, when is "anotherscript.js" being loaded and its contents are being executed?

如果我包括我的当前页anotherscript.js，会发生什么事，然后我打开它有这个脚本的副本包括一些偏远的内容？是否覆盖原有的？如果原来的anotherscript.js中有一个变种，它的值我改变了，然后我重新加载该文件......我失去了价值，或者是第二个加入这个脚本忽略的？

What happens if I included "anotherscript.js" on my current page, and then I load some remote content which has a duplicate include of this script? Does it overwrite the original one? What if the original "anotherscript.js" has a var in it whose value I altered, and then I reload that file... do I lose the original value or is the second inclusion of this script ignored?

如果我加载通过AJAX的一些程序上的Javascript，当它执行？紧接着我 mydiv.innerHTML（remoteContent）？抑或是之前执行的？

If I load some procedural Javascript via AJAX, when is it executed? Immediately after I do mydiv.innerHTML(remoteContent)? Or is it executed before that?

推荐答案

答案取决于那里的脚本标签是和你是如何将其添加：

The answer varies depending on where the script tag is and how you've added it:

1. script标签内嵌您的标记是同步与标记的浏览器的处理执行（除，见＃2），因此，如果 - 例如 - 这些标记引用外部文件时，往往会放慢的页面的处理。 （这是为了让浏览器可以处理文件撰写语句，改变他们正在处理的标记。）

1. Script tags inline with your markup are executed synchronously with the browser's processing of that markup (except, see #2), and so if -- for instance -- those tags reference external files, they tend to slow down the processing of the page. (This is so the browser can handle document.write statements, which change the markup they're processing.)

脚本标记与延迟属性可能，在某些浏览器，无法后才DOM已经完全呈现执行。当然，这些不能使用文件撰写。 （同样有一个异步属性，使脚本异步的，但我不知道这种事，不然怎么那么它的支持;的详细信息。）

Script tags with the defer attribute may, on some browsers, not be executed until after the DOM has been fully rendered. Naturally these can't use document.write. (Similarly there's an async attribute that makes the script asynchronous, but I don't know much about it or how well it's supported; details.)

脚本标签的内容，您（通过的innerHTML 和类似）都不能执行，除非你使用像jQuery库分配给DOM加载后的元素或原型来为你做它。 （有一个例外指出安迪E：。在IE浏览器，如果他们有一个延迟属性，它将执行它们不会在其他浏览器） 的

Script tags in content you assign to elements after DOM load (via innerHTML and similar) are not executed at all, barring your use of a library like jQuery or Prototype to do it for you. (With one exception pointed out by Andy E: On IE, if they have a defer attribute, it will execute them. Doesn't work in other browsers.)

如果您附加一个实际剧本元素添加到文档https://developer.mozilla.org/En/DOM/Node .appendChild> 元素＃的appendChild 时，浏览器会立即开始下载了该脚本将尽快下载完成后执行它。脚本添加这种方式不同步或不一定按顺序执行。首先追加＆LT;脚本类型=文/ JavaScript的SRC =MyFct.js＆GT;＆LT; / SCRIPT＆GT; ，然后追加 ＆LT;脚本类型=文/ JavaScript的＆GT; myFunction的（）;＆LT; / SCRIPT＆GT; 可能执行内联（二）前一个远程（一）种。如果出现这种情况和 MyFct.js 声明 myFunction的（），它不会被当我们试图使用它定义内嵌脚本。如果你需要的东西才能做，你可以知道什么时候一个远程脚本已经加载通过观看负荷和 readyStateChange 在脚本事件元素添加（负荷是大多数浏览器的情况下， readyStateChange 在某些版本的IE浏览器，以及一些浏览器都做，所以你要处理多个通知的同一脚本）。

If you append an actual script element to the document via Element#appendChild, the browser begins downloading that script immediately and will execute it as soon as the download is finished. Scripts added this way are not executed synchronously or necessarily in order. First appending a <script type="text/javascript" src="MyFct.js"></script>, and then appending <script type="text/javascript">myFunction();</script> may well execute the inline (second) one before the remote (first) one. If that happens and MyFct.js declares myFunction(), it will not be defined when we try to use it with the inline script. If you need things done in order, you can tell when a remote script has been loaded by watching the load and readyStateChange events on the script element you add (load is the event on most browsers, readyStateChange on some versions of IE, and some browsers do both, so you have to handle multiple notifications for the same script).

脚本事件处理程序内的属性（＆LT; A HREF =＃的onclick ='myNiftyJavaScript（）;'＆GT; ），而不是在脚本当相关事件发生时标签被执行。

Script inside event handlers on attributes (<a href='#' onclick='myNiftyJavaScript();'>) rather than in a script tag is executed when the relevant event occurs.

我的工作走在我真正的工作，突然我的​​后脑说：你知道，你一直的告诉的他们不会，如果你将它们分配给的innerHTML执行，但你有没有亲自检查？而我没有，所以我做了 - FWIW：

---

I was working away at my Real Job and suddenly my hindbrain said "You know, you've been told they won't be executed if you assign them to innerHTML, but have you personally checked?" And I hadn't, so I did -- 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（我还没有费心去检查别人，我的意思是工作:-)）。而如果你添加元素，如这里，脚本被执行。

这篇关于什么时候浏览器中执行JavaScript？如何执行光标移动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！