jquery的节点操作的几种方法

最新推荐文章于 2020-10-18 19:03:21 发布

Stirve unremitting

最新推荐文章于 2020-10-18 19:03:21 发布

阅读量338

点赞数

分类专栏：笔记文章标签： jquery

本文链接：https://blog.csdn.net/weixin_46421045/article/details/106753985

版权

笔记专栏收录该内容

96 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <script src = 'jquery-1.10.1.min.js'></script>
        <script>
            /*
                • insertBefore()     before()
                • insertAfter()      after()
                • appendTo()         append()
                • prependTo()        prepend()
                • remove()

               
                $() 传入的字符串是带标签的字符串，返回的就是我们创建好的元素节点
            */

            $(function(){
                //找到span节点，插入到div节点的前面  执行
                // $("span").insertBefore("div");
                // $("span").insertBefore($("div"))
                // .css("backgroundColor", 'red');

                //div前面是span  陈述
                $("div").before($("span"))
                .css("backgroundColor", 'green');


                //找到div节点，插入到span节点的后面
                // $("div").insertAfter($("span"));

                //找到span节点，插入到div节点的子节点中的末尾
                // $("span").appendTo($("div"));


                //找到span节点，插入到div节点的子节点的首位
                // $("span").prependTo($("div"));


                //删除div节点
                // $("div").remove();
            })

        </script>
    </head>
    <body>
        <div>div文本<strong>strong文本</strong></div>
        <span>span文本</span>
    </body>
</html>