master

分支 (1)

管理

管理

master

lnmpbroter
/
122.jquery操作dom节点2.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            width: 100px;
            height: 100px;
            background-color: red;
        }
    </style>
    <script src="jquery1.11.3.js"></script>
    <script>
        $(function () {
            //$('div').wrap('<span></span>');
              //$('div').wrap('<span/>');//功能同上
            //$('div').wrap('<span>span</span>');//为div包裹一个span
              //$('div').appendTo('<span>span</span>')//类似，但只能用于插入到已存在的元素内

            //$('div').wrap('<span><li></li></span>');

            //$('div').unwrap();//去掉一层包裹
            //$('div').wrap('<span><li><strong></strong></li></span>');
            //$('div').unwrap();//不接受传参

            //$('div').wrapInner('<li></li>');//添加个内胆

            //$('div').clone().appendTo($('body'));//克隆一个元素
            $('div').click(function () {
                alert('ok');
            });
            // $('div').clone(true).appendTo($('body'));//克隆一个元素,带着附加事件触发方法克隆

            // $('div').remove();//删除元素
            $('div').detach().appendTo($('body'));//删除后添加元素，detach会把附加事件触发方法一并删除，之后一并添加到body中

            $('div').empty();//清空

            $('div').replaceWith('<li>hello</li>');//替换

        });
    </script>
</head>
<body>
<div>div</div>

</body>
</html>