Dom操作（标签--增、删、移动）

最新推荐文章于 2024-01-11 07:06:10 发布

weixin_30832983

最新推荐文章于 2024-01-11 07:06:10 发布

阅读量136

点赞数

原文链接：http://www.cnblogs.com/zqlboke/p/9017074.html

版权

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>

转载于:https://www.cnblogs.com/zqlboke/p/9017074.html

weixin_30832983

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Dom操作（标签--增、删、移动）

Dom操作移动或者插入标签的方法1、append()和appendTo()：在现存元素的内部，从后面放入元素；先声明一个变量用来保存新标签var $span = $('这是一个span元素');然后用append函数将新元素加入到模块中 $('#div1').append($span);2、prepend()和prependTo()：在现存元素的内部，从前面放...
复制链接

扫一扫