• jQuery的节点操作


    1、创建节点

            var aa = $("<div id='cccc'>插入的内容</div>")
            var bb = $("<a href='http://www.baidu.com'>百度一下</a>")
    //创建节点
    
    
    //插入节点
    //    内部插入
    //        插入到内部的前面
    //        $("div").append(bb)
    //        append:插入到节点内部的后面的
    
    
    //        $("h6").appendTo("div")
    //        appendTo:把h6这个标签移动到div标签内部的后面,原来的h6标签将不复存在
    
    
    //        插入到内部的后面
    //        $("div").prepend(bb)
    //        prepend:插入到节点内部的前面的
    
    //        $("div").prependTo(bb)
    //        prependTo:把h6这个标签移动到div标签内部的前面,原来的h6标签将不复存在
    
    
    //    外部插入,相当于同级的插入,包括同级的后面和前面
    //      $("div").after(aa)
    //      after:在div的同级标签的下面的位置插入一个aa的标签,
    
    //        $("div").before(aa)
    //        before:在div的同级标签的上面的位置插入一个aa的标签,
    
    
    //        $("h6").insertBefore("div")
    //        insertBefore:将指定的标签移到div标签的前面,原来的标签则不复存在
    //        $("h1").insertAfter("div")
    //        insertAfter:将指定的标签移到div标签的后面,原来的标签则不复存在
    

      

    2、操作节点,包括包裹,删除,替换,复制

            $(function () {
    //            $("div").wrap("<strong>包裹标签的内容</strong>")
    
    //用strong标签包裹住div标签
    
    
    //        $(function () {
    //            $("div").wrap("<strong><em></em></strong>")
    //        })
    
    //用<strong><em></em></strong>双层标签包裹住div标签,这里是支持多层标签包裹的
    
    
    //        $("em").unwrap()
    //移除em标签外面的第一层包裹的标签
    
    
    //            wrap和wrapAll对比:就用下面的例子做解释,如果只有一个div,那么二者是没有区别的,如果有多个div,那么前者会把每个div作为一个独立的标签,然后用strong
    //            标签去分别包裹多个div标签,而后者会把两个div合为一体,也就是说用一个strong去包裹两个div
    //            $("div").wrapAll("<strong>包裹标签的内容</strong>")
    
    
    //            $("em").wrapInner("<div></div>")
    //wrapInner:的意思在里面包裹一层标签,同样,这个也支持多层标签的包裹
    
    
    //            克隆节点
    //            $("div").click(function () {
    //                alert("123")
    //            })
    
    
    //            $("body").append($("div").clone())
    //            克隆一个节点,然后把这个节点append到body标签内部,如果不带参数,或者参数为false,如果原来的标签有shijian,则不会复制
    
    //            $("body").append($("div").clone(true))
    //            克隆一个节点,然后把这个节点append到body标签内部,如果带有参数,且参数为true,如果原来的标签有shijian,则会复制
    
    
    
    //            删除节点,这个remove可以带有参数,参数可以做更多的过滤限制,比如id 比如class,如果为空,则会全部删除
    //            $("em").remove("#bbb")
    
    //            替换节点
                $("#ccc").replaceWith("<h1>这个是被替换过的</h1>")
            })
    

      

  • 相关阅读:
    2016年个人终结
    从一个程序员的角度看——微信小应用
    Spring 注解
    spring 大纲
    hibernate提纲
    spring基础
    eclipse如何利用userLibrary更好的分类jar
    【tomcat】There are no resources that can be added or removed from the server
    spring mvc 学习历程
    帝国CMS列表模板页面IF判断
  • 原文地址:https://www.cnblogs.com/bainianminguo/p/7653668.html
Copyright © 2020-2023  润新知