这是一个奇怪的情况.尽管确保它的所有依赖项都在它之前加载(在我的情况下它只是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/