javascript - 即使在任何新的 div 附加到其父级之后，仍将 div 保留为其父级的最后一个子级

Question

你好，我正在努力解决一个问题。结构就像:-

<div class="parent" >
    <div class="child1" >
    </div>
    <div class="childToBeKeptLast" >
    </div>
</div>

插入新 child 后

<div class="parent" >
      <div class="child1" >
    </div>
     <div class="child2" >
    </div>
    <div class="childToBeKeptLast" >
    </div>
</div>

因此，无论在父 div 中发生多少次插入，我总是希望让我的 child 与“childToBeKeptLast”类一起作为最后一个 child 。如何通过 css 或 jquery 实现这一点？？

任何帮助将不胜感激...谢谢...

Answer 1

尝试使用.insertBefore()在这种情况下，

$('.child2').insertBefore('.parent .childToBeKeptLast');

所以上面的代码将在具有类 childToBeKeptLast 的元素之前插入新的子元素，并且它是具有类 parent 的元素的后代