JQ 节点操作

一、内部插入：给当前节点添加孩子

   A.append(B)          向【A节点内部现有内容之后】追加【B节点】

   B.appendTo(A)      将【B节点】追加到【A节点内部现有内容之后】

   A.prepend(B)         向【A节点内部现有内容之前】追加【B节点】

   B.prependTo(A)     将【B节点】追加到【A节点内部的现有内容之前】

ps：

        jq对象新键节点 $('<标签 属性>内容</标签>')

eg：

$("button").click(function(){
        $(".box").append ($("<p style='color: aqua;'>我是一个新增的节点</p>"));
        $(".box").prepend($("<p style='color: aqua;'>我是一个新增的节点</p>"));
        $(".box").after($("<p style='background-color: pink'>我是一个兄弟</p>"));
        $(".box").before($("<p style='background-color: pink'>我是一个兄弟</p>"));
 })

二、外部插入：给当前节点添加兄弟

    A.after(B)                       在【A节点之后】添加【同级节点B】

    A.before(B)                    在【A节点之前】添加【同级节点B】

    A.insertAfter(B)              把【A节点】添加到【B节点之后】

    A.insertBefore(B)           将【A节点】添加到【B节点之前】

eg：

 $('button').click(function () {
        $('.box').after($('<p>333333333333333</p>'));
        $('.box').before($('<p>333333333333333</p>'));
 });