标题问题说明了一切。 在大多数情况下,我理解后一种情况。 读取Javascript时,对DOM的引用必须具有某种含义,这就是为什么我们将其包装在$(document).ready回调中,或将我们的脚本置于<body>下的原因。 我真的不明白为什么$(document).on(...)似乎不管位置如何都可以工作。

任何输入将是浓汤。

===============>>#1 票数:3 已采纳

当您执行$(anything) ,任何对象都必须在运行选择器时存在。

当您进入<head>部分时, document对象已经存在,因为它是整个页面的主父。 但是,主体中还不存在任何东西,因此$(“.class”)将不存在,因此选择器将找不到任何东西(或者更糟糕的是,由于主体甚至不存在而失败)。

但是$(document)确实最早存在,您可以运行脚本(在<head>部分中,因此$(document)可以工作,并且有附加事件处理程序的东西。

如果要在<body>中查找元素,例如示例$(".class") ,则要么必须等待<body>部分加载类似jQuery的.ready() (这样,这些元素就会在脚本运行之前就已经存在),否则您必须将脚本实际放置在<body>以便在运行脚本时已解析了所需的元素。


如果要在.on()使用委托事件处理,则需要添加以下内容:

$(mySelector).on("click", ".myClass", fn);

然后, $(mySelector)中的对象是事件处理程序将直接附加到的对象,并且这些是运行此代码行时必须存在的对象。 运行此代码时,与".myClass"匹配的对象不必存在。 因此,如果通过以下方式附加到文档对象来进行委托事件处理:

$(document).on("click", ".myClass", fn);

然后,在运行此代码行时,仅document对象必须存在。 由于document对象是首先创建的,因此当您可以运行javascript代码时该对象已经存在,因此它似乎总是可以正常工作。

这引发了一个有趣的问题,即您是否可以仅将所有事件处理程序附加到document对象。 如果要这样做,则需要进行一些权衡(某些事件仅在直接附加到源对象的情况下才能正常工作),因此不应在不了解后果的情况下盲目地这样做。 有关将所有事件附加到文档对象上的折衷的详细讨论,请参见此答案

  ask by Louis93 translate from so

未解决问题?本站智能推荐:

2回复

为什么必须将我的jquery函数用于按钮单击事件放在$(document).ready()中?

考虑以下html。 ...当我尝试通过以下方式在test.js中为按钮的click事件实现jQuery事件处理程序时... ... 这是行不通的。 但是,如果我用准备好的文档包装功能,如... ... 有用。 这是为什么? 是否所有事件处理程序都应放置在文档中了?
3回复

之前是放置脚本标记 标记相当于jQuery的document.ready方法

如果我们在关闭body之前的脚本标记中调用javascript方法myMethod() ,它是否相当于在jQuery的document.ready函数中调用myMethod() ? 如果没有,为什么?
3回复

$(document).ready在$(document).ready中

我在代码库中找到了代码,其中$(document).ready(function() {...}位于另一个$(document).ready(function() {...} 例如 我想了解执行的顺序,所以我可以安全地重构这个嵌套的回调。 外部回调似乎在内部回调执行之前继续执行。
4回复

jQuery document.ready和函数放置

我有一个功能: 在$(document).ready(function(){ /*code*/ }); ,我将其分配给html标签中的onClick事件。 (是的,我知道onClick内联形式很差-目前我正在使用它!) 这是一件有趣的事情:仅在$(document).ready
2回复

如何将文档准备功能放置在ajax函数中

我在其他3个页面上使用了datepicker函数,并且一切正常,但是现在我试图将其添加到基于ajax函数调用showbookings生成的页面中。 当前有8个单击功能在加载动态内容后将重新连接,但是我无法使datepicker正常工作,显示,什么也没有。 那么,如何使用$(document)
1回复

为什么必须将.ajaxComplete附加到文档?

看到“从jQuery 1.8开始,.ajaxComplete()方法应仅附加到文档。” 在jQuery文档中,所以我想知道为什么必须将它附加到文档中。 正如我尝试过的,如果我将其连接到窗口或其他地方,它会很好地工作。
3回复

在同一页面上多次调用$(document).ready [重复]

可能重复: 您可以有多个$(document).ready(function()节吗? 可以在同一页面上多次调用$(document).ready吗? 如果是这样,如何解析代码的运行顺序,这有什么含义? 我在Rails应用中使用jQuery。 我在应用程序中使用了多个级
1回复

Ajax加载页面上的document.ready

我正在使用 反过来,“ ajax.html”包含document.ready调用: 我的问题是何时确切调用此回调。 假设ajax.html完全将ajax.html加载,解析和编写脚本是否安全?
5回复

在哪里放置$(文件).ready(function()?[复制]

这个问题在这里已有答案: document.ready body标签 2答案 我们经常在这里和那里阅读,我们必须将我们的js代码放在页头部分或之前 (抱歉)结束正文标记。 关于这一点的讨论,我只是想知道浏览器对这些东西的阅读顺序是什么(考虑到它们在这里做的相同):
6回复

我可以避免在每个JavaScript文件中放置$(document).ready()调用吗?

因此,一个简单的问题,是否可以在每个.js文件中编写jQuery代码而无需编写$(document).ready(function() ? $(document).ready(function() ,包括Js文件,例如<script src="app/jsCode/test.js">&l