文档处理

文档操作:

  内部插入:

    a.append(c): 将c插入到a的内部(标签体)后面

    bprepend(c):  将c插入到a内部的前面

 

    a.appendTo(c):将a插入到c的内部前面

    a.prependTo(c):将a插入到c的内部后面

<html>
  <head>
    <title>01_内部插入节点.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        //0.获取两个元素
        var $city = $("#city");
        var $fk = $("#fk");
        //1.在city的后面内部追加 反恐
        //$city.append($fk);
        //2.在city的前面内部插入 反恐
        $city.prepend($fk);
    });
    </script>
    </head>
     
    <body>
         <ul id="city">
              <li id="bj" name="beijing">北京</li>
             <li id="tj" name="tianjin">天津</li>
             <li id="cq" name="chongqing">重庆</li>
         </ul>
          <ul id="love">
              <li id="fk" name="fankong">反恐</li>
             <li id="xj" name="xingji">星际</li>
         </ul>    
        <div id="foo1">Hello1</div>        
    </body>
<script type="text/javascript">
</script>  
</html>

  外部插入:

    a.after(c):将c放到a的后面

    a.before(c):将c放到a的前面

 

    a.insertAfter(c):将a放到c的后面

    a.insertBefore(c):将a放到c的前面

<html>
  <head>
    <title>02_外部插入节点.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            var $p2 = $("#p2");
            var $city = $("#city");
        //1.在 p2 的后面插入 city
            $p2.after($city);
        //2.在 p2 的前面插入 city
            $p2.before($city);
        });
    </script>
    </head>
    <body>
         <ul id="city">
              <li id="bj" name="beijing">北京</li>
             <li id="tj" name="tianjin">天津</li>
             <li id="cq" name="chongqing">重庆</li>
         </ul>
        
         <p  id="p3">I would like to say: p3</p>
         
         <p  id="p2">I would like to say: p2</p>
        
         <p  id="p1">I would like to say: p1</p>
       
    </body>  
</html>

  删除:

    empty()  清空元素

    remove()   移除元素

<html>
  <head>
    <title>03_删除节点.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            var $u1 = $("ul");
        //1.清空ul
            //$u1.empty();
        //2.移除天津 remove
        $("#tj").remove();
                    
        });
    </script>
    </head>
        
    <body>
         <ul id="city">
              <li id="bj" name="beijing">北京<p>海淀区</p></li>
             <li id="tj" name="tianjin">天津<p>河西区</p></li>
             <li id="cq" name="chongqing">重庆</li>
         </ul>
        <p class="hello">Hello</p> how are <p>you?</p> 
    </body>
</html>

 

上一篇:一位成都测评大师的忠告:不了解亚马逊测评的!别想在这上面赚钱!


下一篇:Hive和HBase的区别