. 十二. 节点操作(添加节点, 删除节点, 克隆节点, 清空节点)

时间:2021-04-09 22:09:25
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div {
            width: 300px;
            height: 300px;
            background-color: pink;
        }
    </style>
</head>
<body>
<div>
    <p>1111</p>
    <p>2222</p>
    <!--<a href="http://web.itcast.cn" target="_blank">itcast</a>-->
</div>
<span>我是外面的span</span>
<script src="jquery-3.2.1.js"></script>
<script>
    $(function () {
        // 动态创建节点
        var $a = $("<a href='http://www.baidu.com' target='_blank'>RayLee</a>");
        $("div").append($a);

        // 清空节点, 清理门户
        $("div").empty();

        // 删除节点
        // $("div").remove();

        // 添加事件
        $("span").click(function () {
            alert("span");
        })

        // 克隆节点 true 带事件的复制, false 默认的复制, 不带事件的复制
        $("span").clone(true).appendTo("div");
    });
</script>
</body>
</html>