使用 jQuery 的 .load() 加载页面片段但只获取选择器的内容答案

【问题标题】：Use jQuery's .load() to load page fragments but only get contents of selector使用 jQuery 的 .load() 加载页面片段但只获取选择器的内容
【发布时间】：2013-08-12 19:25:17
【问题描述】：

我正在使用 jQuery 的 .load() 页面片段方法重新加载我的页面：

$("#submit").click(function() {
    $("#box").load('/ajax/box/ #box');
});

它可以工作，但是这会导致错误，因为在加载内容之后。由于这个函数本质上使用.innerHTML，它正在替换我的div 内部的代码。 HTML 结果如下所示：

<div id="box">
    <div id="box">
        <!-- this is my page -->
    </div>
</div>

我尝试使用 .parent()，但删除了父级中的所有其他 divs。

$("#submit").click(function() {
    $("#box").parent().load('/ajax/box/ #box');
});

基本上这就是我想要做的（我知道下面的代码是无效的，但这代表了我想要完成的事情）：

$("#submit").click(function() {
    $("#box").load('/ajax/box/ $('#box').html()');
});

有没有办法让#box 被#box替换？
需要记住的一件事是我无法编辑 HTML，所以这需要只使用 jQuery。

【问题讨论】：

同样的问题在这里：stackoverflow.com/questions/1344030/… -- 推荐的答案是使用 $.get 调用，并在回调中对目标元素运行 replaceWith。
那行不通。阅读已接受答案中的评论stackoverflow.com/a/5300738/1893629
你能用unwrap()吗？比如：$("#box").load('/ajax/box/ #box', function() { $(this).find("#" + this.id).unwrap() });
有点工作。我不得不手动输入id。但是现在，每当我再次尝试加载数据时，它都会在控制台中导致另一个错误...Uncaught ReferenceError: jQuery is not defined
嗯......这是一个新的......只发生在第二个 load 函数或任何 jQ 函数上？

标签： jquery jquery-load

【解决方案1】：

只需在#box 之后添加> *

$("#submit").click(function() {
    $("#box").load('/ajax/box/ #box > *');
});

【讨论】：