Question

我有一个分为2列的网站（每个网站宽度为50％）：

HTML：

<nav></nav>
<div class="left-column"></div>
<div class="right-column"></div>
<footer></footer>

我有一个带html的辅助页面：

<nav></nav>
<div class="left-column"></div>
<div class="right-column level-two"></div>
<footer></footer>

使用.load（）我想让辅助页面上的右栏加载到第一页的右栏顶部（之后添加一个关闭框）。

html看起来像这样：

   <nav></nav>
   <div class="left-column"></div>
   <div class="right-column level-two"></div> //THE RIGHT COLUMN FROM LEVEL 2 INSERTED HERE
   <div class="right-column"></div>
   <footer></footer>

问题是我无法找到一种方法：.append（）仍然将它添加到它附加的div中。并且.before（）无法添加jquery（？）只是内容？< / p>

我希望存在两个右栏，因为如果我关闭right-column level-two，我仍然希望下面有原始的right-column。

Answer 1

$.get('<secondary_page_url>',function (data) {
  $(data).find('.right-column.level-two').insertBefore($('.right-column'));
})

Answer 2

使用CSS选择器搜索班级left-column及其邻居班级right-column
将holder中的数据插入两个类之间

    $(document).ready( function () {
        $.get('second-page-url.html',function (data) {
        $(data).find('.right-column.level-two').insertBefore($('.left-column + .right-column'));
});

.load（）在DOM中的另一个div之前添加一个div（不在里面）

2 个答案: