我正在浏览http://docs.jquery.com/How_jQuery_Works，发现在$(document).ready() 中包含$.click() 事件的要求甚至有点奇怪。我的困难如下：
$(document).ready()函数，但它会继续执行$.click()吗？ （基于行为它不会。但是当控件进入正常功能时，为什么不进入$.click()功能？）$(document).ready()中嵌入$.click()吗？【问题讨论】：
标签： javascript jquery
How jQuery Works document 使用在$(document).ready() 内部绑定.click() 的示例来确定绑定.click() 事件的元素在函数执行时已创建。
以函数作为参数调用的.click() 不会执行匹配其前一个选择器的节点上的.click()，而是将函数绑定到匹配节点的onclick。
如果你尝试做这样的事情：
$('a').click(function(){
alert('clicked me');
});
...在文档<head> 中或在呈现任何<a> 元素之前，事件不会绑定到任何节点，因为在函数执行时不存在与$('a') 选择器匹配的节点。
此外，如果您在创建一些<a> 标签时这样做，则只有那些已经创建的标签才会获得绑定事件。在函数绑定后创建的<a> 标签不会有.click() 绑定。
所以在 jQuery（和其他 JavaScript 框架）中，您经常会看到在 $(document).ready(function(){}); 中添加事件处理程序、绑定小部件等的约定
【讨论】：
这里关注的不是对.click() 的实际调用，而是调用它的元素的选择器。
例如，如果有一个带有id="myButton" 的元素，那么您将引用它：
$('#myButton')
但是，如果该元素尚未加载（也就是说，如果文档尚未准备好并且您不知道当前加载了哪些元素 )，那么该选择器将找不到任何东西。所以它不会在任何事情上调用.click()（绑定事件或触发它，具体取决于.click() 的参数）。
您可以使用其他方法，such as the jQuery .on() function，它可以将事件绑定到公共父元素，并从文档生命后期添加的事件中过滤“冒泡”事件。但是如果你只是使用一个普通的选择器并调用一个函数，那么选择器需要在 DOM 中找到一些东西才能让函数做任何事情。
【讨论】：
是的，您需要确保要向其中添加点击处理程序的 DOM 元素存在，您可以通过准备好的文档知道这一点。
【讨论】：
$(document).ready(..) 方法试图解决的问题是页面 javascript 代码的执行与页面中的控件被绑定的时间之间的紧张关系。 ready 函数将在文档准备好并且 DOM 元素可用时触发，因此 javascript 代码可以对 DOM 做出合理的假设
最常见的例子是 javascript 代码相对于它试图操作的 DOM 元素的位置。考虑
<script>
$('#target').click(function() {
alert('It was clicked');
});
</script>
<div id="target">Click Me</div>
在此特定示例中，javascript 将无法按预期运行。当输入脚本块时，click 行将运行，并且当前没有 ID 为 target 的 DOM 元素，因此处理程序绑定到任何内容。代码并没有什么问题，只是不幸地在创建 DOM 元素之前运行了。
在这个例子中问题很明显，因为代码和 DOM 元素在视觉上是配对在一起的。在更复杂的网页中，尽管 javascript 通常位于完全独立的文件中，并且没有关于加载顺序的视觉保证（也不应该）。使用$(document).ready(..) 抽象消除了作为潜在问题来源的排序问题，并促进了关注点的适当分离
【讨论】：
Javascript 通常在读取标签后立即开始执行。这意味着在将脚本放在头部的标准实践中，还没有创建任何元素供您绑定点击处理程序。甚至身体元素还不存在。使用 jQuery.ready 会延迟执行代码，直到所有 DOM 元素都已加载。
【讨论】：