在您的情况下,绝对不是这样的,因为您正在使用框架。它的工作方式如下:
1)随着页面逐步加载,从外部文件请求脚本代码。在 script 标签被解析之前,HTML 解析器必须解析脚本标签。当调用此代码时,它会执行,但一旦它可供 JavaScript 解释器使用,它就会被馈送到 JavaScript 解释器中。
2)直接驻留在页面中的脚本代码将随着 HTML 代码由 HTML 解析器解析并遇到脚本标记而被馈送到解释器中。函数内部的代码在调用时执行,除了一个例外。否则,代码会立即执行解释。唯一的例外是当函数块紧随其后跟随“()”时,表示立即调用。
3)大多数最初执行的代码都是通过“onload”事件进行函数调用。当静态 DOM 从 HTML 解析器完全可用且初始静态 HTML 的所有资产请求都已请求时,onload 事件发生。在某些边缘情况下,旧版浏览器可能会出现冲突条件,从而在页面中创建竞争条件,导致 onload 事件永远无法触发或延迟非常长。
4) 你正在使用jQuery,因此在可用性方面处于严重劣势。 jQuery代码是JavaScript代码,因此它必须像任何其他JavaScript一样进入JavaScript解释器。 在任何jQuery代码执行之前,必须遵守本帖子中的所有先前点。
5) 当我执行A / B测试时,我需要尽可能早地执行代码并尽可能快地执行,以最小化页面上的闪烁,因此框架绝对不是一个选项。 在这种情况下,我遵循以下步骤:
5a)我查找所需访问的DOM节点后直接找到第一个id属性。
5b)我编写一个函数来测试此节点的可用性。 如果该节点可用,则其上方区域也可用,因此我知道我是稳定的。 请考虑以下示例:
var test = function () {
var a = document.getElementById("first_node_lower_than_I_need");
if (a !== null && typeof a === "object") {
} else {
setTimeout(test, 100);
}
};
setTimeout(test, 100);
5c) 注意在上面的示例代码中,我使用setTimout延迟调用我的函数,以便DOM有更多的时间加载。如果函数提前执行,那没关系,因为我会递归地调用它并设置延迟,以给DOM一些额外的加载时间。如果您将延迟设置为50ms或更低,则由于对函数的大量不必要调用,会增加IE8及以下版本的执行时间。我建议将延迟保持在100ms,以实现跨浏览器的理想平衡,但如果您真的想在新浏览器中实现快速执行,则将第一个延迟设置为50ms(这是函数外部的延迟),并将另一个延迟保持在100ms。
5d) 最小化使用innerHTML属性,或者非常熟悉目标页面,知道何时可以使用innerHTML。 innerHTML的问题在于它会更改页面输出,而不将这些更改报告回内存中解析的DOM,这通常是一个无关紧要的断开连接。然而,在这种情况下,由于您注入的代码可以快速且早期地执行,因此这显然是相关的。这是一个问题,因为稍后执行的其他代码(例如onload事件或jQuery的ready事件)将覆盖您的更改,或者根本找不到其受尊重的DOM加载并完全放弃执行。如果您针对DOM树中的非常高级节点,则特别需要注意此问题,因此为了安全起见,请在选择要使用innerHTML的节点时非常具体,或者只使用DOM方法。这有点复杂,因为您不能仅使用DOM方法解决问题,因为在跨浏览器中,您无法使用nodeValue方法更改文本节点,因为IE7不支持此方法。
如果您需要在DOM解析完成之前执行JavaScript代码,则不要使用JavaScript框架。请使用普通的JavaScript代码编写,并对其进行优化。否则,您将始终会出现闪烁问题,静态HTML下载越大,闪烁时间就越长,也越明显。此外,由于jQuery依赖于类似CSS的选择器,因此jQuery代码往往比常规优化的JavaScript执行速度慢得多。如果您注入的jQuery代码需要在非常大的静态HTML文档上执行大量任务,则在IE7中完成执行的可能性很小。
$('#question')
是否在DOM中。我建议先运行此代码,然后再询问是否有问题。 - gen_Eric