jquery操作文档结构学习

    操作文档结构学习：
                获取元素对象
                    1、内部插入
                        append("内容")                将指定的内容追加到对象的内部
                        appendTo(元素对象或者选择器)        将制定的元素对象追加到指定的对象内容
                        prepend()                    将指定的内容追加到对象的内部的前面
                        prependTo()                    将制定的元素对象追加到指定的对象内容前面
            
                    2、外部插入
                        after                    将指定的内容追加到指定的元素后面
                        before                    将指定的内容追加到指定的元素前面
                        insertAfter                把所有匹配的元素插入到另一个、指定的元素元素集合的后面
                        insertBefore              把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
                    3、包裹
                    4、替换
                    5、删除
                        empty()

<script type="text/javascript">
            //内部插入
                function testAppend(){
                    //获取元素对象
                        var div=$("#showdiv");
                    //使用内部插入
                        div.append("<i>，饭</i>");
                }
                
                function testAppendTo(){
                    //获取元素对象
                        var div=$("#showdiv");
                    //使用appendTo()
                        $("#u1").appendTo(div);    
                }
                
                function testPrepend(){
                    //获取元素对象
                    var div=$("#showdiv");
                    //使用prepend()
                    div.prepend("<i>你好，</i>");
                }
            //外部插入
                function testAfter(){
                    //获取元素对象
                        var div=$("#showdiv");
                    //使用after外部插入
                        div.after("<b>今天天气不错，适合学习</b>");
                    
                }
                function testBefore(){
                    //获取元素对象
                        var div=$("#showdiv");
                    //使用before外部插入
                        div.before("<b>今天天气不错，适合学习</b>")
                    
                }
                function testEmpty(){
                    $("#showdiv").empty()
                }
        </script>

转载于:https://my.oschina.net/wzh001/blog/3027814