Dom操作

移动或者插入标签的方法

1、append()和appendTo():在现存元素的内部,从后面放入元素; 先声明一个变量用来保存新标签 
var $span = $('这是一个span元素');

然后用append函数将新元素加入到模块中 $('#div1').append($span);

 

2、prepend()和prependTo():在现存元素的内部,从前面放入元素

3、after()和insertAfter():在现存元素的外部,从后面放入元素

4、before()和insertBefore():在现存元素的外部,从前面放入元素

删除标签

$('#div1').remove();

实例代码

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        div{background:pink;}
    </style>
    <script type="text/javascript" src="jquery-1.12.4.min.js" ></script>
    <script type="text/javascript">
        $(function(){

            //$('div').html( $('div').html() + '<p>我是JS生成的标签</p>')

            //自定义标签生成成功。    名字:节点
            var $p = $('<p>我是JS生成的标签</p>');
            //在div的内部最后去追加一条数据
            //$('div').append($p);

            //在div的内部最前去追加一条数据
            //$('div').prepend($p);

            //在div的外部之前去追加一条数据
            //$('div').before($p)

            //在div的外部之后去追加一条数据
            $('div').after($p);


            //删除标签。斩草除根,标签都直接删除
            $('ul li').eq(1).remove();
        })
    </script>
</head>
<body>

    <div>
        <p>我是原有的p标签</p>
    </div>
    <ul>
        <li>1111</li>
        <li>2222</li>
        <li>333</li>
    </ul>
</body>
posted on 2018-05-09 22:31  大可可  阅读(269)  评论(0编辑  收藏  举报