为什么“负载”不起作用？答案

【问题标题】：Why the "load" doesn't work?为什么“负载”不起作用？
【发布时间】：2014-09-11 06:01:19
【问题描述】：

index.html：

<div id="divTestArea2"></div>
<script type="text/javascript">

$("#divTestArea2").load("index-2.html #test");

</script>

index-2.html：

<div id="test"><b>Hello World!</b></div>

为什么“负载”不起作用？

【问题讨论】：

您是否在控制台中收到 js 错误。那会很有帮助。
你在本地测试吗？
ReferenceError: $ is not defined index.html:61 HTML 文档的字符编码未声明。如果文档包含 US-ASCII 范围之外的字符，则文档将在某些浏览器配置中呈现乱码。页面的字符编码必须在文档或传输协议中声明。
阅读本文。 stackoverflow.com/questions/8277462/…

【解决方案1】：

假设：

$ 尚未定义；在您的页面中包含 jQuery 之后，您的脚本可能需要运行。如果是这种情况，您应该会看到控制台错误。
index-2.html 不是基于当前页面 URL 的有效相对 URL。查看您的开发人员工具的网络选项卡，查看是否正在执行对 index-2.html 的请求。如果您收到 404 错误，则可能是 URL 不正确。

编辑

现在您已经发布了错误，我们知道原因是 #1； $ 只有在页面中包含 jQuery 时才会被定义。如果您已经拥有该脚本标签，请将您的代码移到之后。如果没有，请尝试添加如下内容：

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

【讨论】：

jQuery 可能已经被包含，但使用 noConflict 也经常发生在 wordpress 网站上
并且 OP 可能需要将脚本包含在文档就绪处理程序中。
@JayBlanchard 如果脚本元素出现在引用的div 之后，那么它将起作用。
养成这个习惯并不是一个坏习惯（尤其是在刚开始学习 JavaScript 和 jQuery 时），它只是需要（诚然很小）的权衡，即等待时间过长。然而，听起来你经历了一些更深层次的边缘情况，这是必要的，你是否使用了像 yepnopejs.com 或 requirejs.org 这样的脚本加载器？
不，@JasonSperske，当时两者都没有使用，但 Modernizr 可能已经使用了。不过，我必须检查每种情况是否都是这种情况。

【解决方案2】：

尝试添加# 字符以通过id 选择元素并将您的代码放入ready 事件中。

$(document).ready(function() {

    $("#divTestArea2").load("index-2.html");

});

您可以将 div 分隔到另一个文件中以仅获取必要的部分，而不是尝试读取文件中的 div。

【讨论】：