关于 $.load() 的一个奇怪问题答案

【问题标题】：One strange issue about $.load()关于 $.load() 的一个奇怪问题
【发布时间】：2009-09-10 04:38:54
【问题描述】：

这是我使用 $.load() 加载到 DOM 中的文件：

<script type="text/javascript">
    $('.close').click(function() { alert(1) });
</script>
<div class="close">
    click me
</div>

话说，我觉得<script>部分在加载时会自动延迟，这是$.load()的特性吗？

如果是这样，它是如何实现的？

感觉很棒！

【问题讨论】：

延迟是什么意思？您的意思是说在调用 $.load() 时不会发生警报，而是仅在此操作并且单击 DIV 之后发生？
如果您使用浏览器直接访问该文件，脚本将无法按预期工作（单击它时，没有警报）。但是如果您使用 $.load() 将其加载到另一个页面，它会起作用（点击时会发出警报）。
这可能是因为直接加载它不会让 DOM 在尝试绑定该事件之前有任何时间准备好。但是使用加载，它给了 DOM 时间来加载并在绑定之前准备好。
这是页面中唯一加载到 DOM 中的 HTML 吗？
有没有人成功地深入了解 jQuery 的源代码，看看到底发生了什么？

【解决方案1】：

我已经阅读了 jQuery 源代码，这是我发现的：

（行号参考未压缩的 jQuery 1.3.2）

jQuery.load 最终获得响应并调用 jQuery html 方法并将结果插入。 （在第 3267 行附近）
jQuery.html 然后调用 jQuery append 方法。 （第 488 行）
jQuery.append 然后使用插入 DOM 节点的回调函数调用 domManip 方法。 （第 253 行）
domManip （在第 514 行） 有点棘手，但最终它确实将 DOM 节点传递给要插入的回调，然后为每个脚本调用 evalScriptafter 插入 DOM 节点，无论它们在加载的 html 中的顺序如何。 （第 526 行）。

因此，jQuery 实际上以延迟方式执行脚本！

使用来源，卢克。

【讨论】：

【解决方案2】：

"如果您直接使用浏览器访问该文件，该脚本将无法按预期工作（单击它时，没有警报）。但是如果您使用 $.load() 将其加载到另一个页面，它将工作（单击时发出警报）。- 岸上”

当您在浏览器中加载文件本身时，单击它时没有警报的原因是因为当浏览器读取“$('.close')...”行时，还没有“close”类的DOM对象，因为在脚本标签之后。

您可以通过以下方式解决此问题：

$(document).ready(function(){$('.close').click(function() { alert(1) });});

至于延迟部分，是因为当你使用$.load()时，函数先加载文件，然后将源放入DOM对象中。将 source 放入 DOM 对象后，它将解析文件中的 <script> 标签。这就是为什么您的点击事件成功地绑定到您的 DOM 对象，类为 close

【讨论】：