Question

我有一些跟踪代码，提供者（WebTraxs）说应该放在标签的底部。问题是这个相同的代码导致页面上的所有内容（包括我的jQuery代码）在WebTraxs执行后运行。这种执行有时需要足够长的时间，因为用户在WebTraxs完成之前将鼠标悬停在图像上，因此图像翻转等不起作用。

因此，我正在尝试在文档就绪处理程序中加载页面后，将所需的标记（从WebTraxs）添加到正文中，使用以下内容：

 setTimeout(function(){

  var daScript = '<script language="JavaScript" type="text/javascript" src="/Scripts/webtraxs.js" />';
  var daOtherScript = '<noscript><img alt="" src="http://db2.webtraxs.com/webtraxs.php?id=company&st=img" />';

  $('body').append(daScript);
  $('body').append(daOtherScript);

 },  
 5000);

上面有两个问题：

在Firefox中，5秒后，页面完全空白。
在IE中，没有抛出任何错误，但通常您可以看到WebTraxs代码尝试在状态栏中加载跟踪图像。上述代码不会发生这种情况。

有没有更好的方法来实现我的目标？我基本上只是想确保在执行文档就绪处理程序之后执行WebTraxs代码。

Answer 1

为什么不使用.getScript功能：

 setTimeout(function(){

  $.getScript("http://path.to/Scripts/webtraxs.js");
 },  
 5000);

您对代码的好奇之处在于您使用JavaScript添加了<noscript>标记...它没有任何意义。如果用户没有JavaScript，则不会触发setTimeout，因此不会显示<noscript>内容。

我基本上只是想确保在执行文档就绪处理程序之后执行WebTraxs代码。

在这种情况下，你只需要这样做：

$(document).ready(function(){
    $.getScript("http://path.to/Scripts/webtraxs.js");
});

Answer 2

<script>代码无法使用<script/>之类的快捷方式。

您使用<script></script>

无论如何，我不明白在DOMready上或在特定时间段后执行这些脚本的区别。如果它阻止了用户界面，它会在5秒钟之后做同样的事情吗？

Answer 3

您错过了结束</script>和</noscript>代码。

Answer 4

您不必使用jQuery的DOMReady事件处理程序。人们使用DOMReady的原因是它允许在启动操作页面的脚本之前加载完整的DOM。如果您过早地调用脚本，则可能无法访问您网页的部分内容 - 例如，如果您在<div id="footer">...</div>之前调用它们，则他们将无法看到$('div#footer')，因为它未被提取进入DOM了。这很好，除了你的DOMReady方法总是在之后执行首先执行任何页内脚本。这就是为什么你的webtrax代码首先被执行的原因。

但是你可以获得DOMReady的相同好处，并且仍然可以通过在文档末尾调用页面脚本来控制执行顺序，除了HTML结束标记之外什么都没有。它们将按照它们出现的顺序执行。

所以试试这个：

<html> <head> <script type="text/javascript" src="myPageScripts.js"></script> </head> <body> <div id="pagesection1"></div> <div id="pagesection2"></div> <div id="pagesection3"></div>  <script type="text/javascript">//<![CDATA[ runMyPageInitializerScripts(); //]]></script> <script language="JavaScript" type="text/javascript" src="/Scripts/webtraxs.js" ></script> </body> </html>

在此脚本中，runMyPageInitializerScripts()仍然可以完全访问#pagesection1，pagesection2和pagesection3，但不会看到最终的script标记。因此，页面与完全的条件不同于触发DOMReady时的相同条件，但对于大多数脚本，通常没有缺点。

Answer 5

如果你想保留<script>标签，你可能需要将其转义（不确定这是否仍然存在于最新的浏览器上，但据我记得你内部没有<script>标签脚本标记），以旧的谷歌分析代码为例：

document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

拆分脚本标记也有效：

document.write("<scr"+"ipt src='somescript.js'></sc"+"ript>");

但是由于你使用的是jQuery，.getScript()是你最好的选择。

如何使用jQuery和setTimeout（）添加Javascript代码

5 个答案: