Jquery之Dom操作_jquery dom insertafter()-CSDN博客

本文链接：https://blog.csdn.net/Aloe_904/article/details/78370059

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dom操作</title>
    <script type="text/javascript" src="../jquery-3.2.1.min.js"></script>

    <!-- 
    jquery中的DOM方法
    insertBefore():A.insertBefore(B),将A移动添加在B的前面，A并不是复制，而是剪切移动
    before()
    insertAfter():与上述相反,原生JS中没有
    after()
    appendTo():在被选元素的开头（仍位于内部）插入指定内容,类似原生中的appendChild();
    append()
    prependTo():在被选元素的开头（仍位于内部）插入指定内容
    prepend()
    brfore():A.before(B).A的前面必须是B
    remove():删除节点

    两者的关系：是后续操作有所不同；
    insertBefore()
    brfore()它后续的操作始终作用在A 的身上
     -->

    <script type="text/javascript">
    $(function(){
        $('span').insertBefore($('div'));//将span标签添加到div标签的前面
        $('span').insertAfter($('div'));
        $('div').appendTo($('span'));
        $('div').prependTo($('span'));

    })
    </script>
</head>
<body>
    <div>div</div>
    <span>span</span>
</body>
</html>