除非在页脚中执行，否则脚本不起作用

Script doesn't work unless executed in footer

本文关键字：脚本 不起作用 执行      更新时间：2023-09-26
这是一个

奇怪的情况。尽管确保它的所有依赖项都在它之前加载（在我的例子中它只是 jQuery 库），但我的脚本在 head 部分加载时不起作用（即 <head> ），但在加载到页脚（标签上方的某个地方）时会完成其工作</body>）。

由于这还不够清楚，让我举一个活生生的例子。这是网页。现在，查看页面的源代码，在那里，这就是我正在谈论的代码。

<script type='text/javascript'>
/* <![CDATA[ */
var yjlSettings = {"gifUrl":"http:'/'/whatthenerd.com'/wp-content'/themes'/reddlec'/images'/ajax-loader.gif","autoGrow":"enable"};
/* ]]> */
</script>
<script type='text/javascript' src='http://whatthenerd.com/wp-content/themes/reddlec/js/no-reload-comments.js?ver=3.3.2'></script>

它应该做的是允许用户在不重新加载页面的情况下发表评论。（请随时在页面上测试评论 :) ） - 但事实并非如此。为什么？

PS：就像我之前说的，当上述脚本在</body>标签之前加载时，一切正常。我真的看不出是什么导致了冲突。

您的脚本会立即在 DOM 中查找元素：

var $commentlist = jQuery('.commentlist');
var $respond = jQuery('#respond');

在脚本中找到的两个示例。这些项目在加载标头时不存在，但在到达身体末端时它们确实存在。如果你想从你的标题加载它，你需要把它包装在一个文档就绪块中：

jQuery(document).ready(function($) {
  // Code using $ as usual goes here.
});

这样就可以安全地在页面顶部加载，方法是延迟代码的执行，直到文档完全加载并构造 DOM。

有关在线ready的更多信息： http://api.jquery.com/ready/

相关文章：