为什么把this改成".aaron2"之后是以倍数增加div的

来源:5-1 DOM拷贝clone()

qq_慕虎8015442

2019-12-13 09:44

<!DOCTYPE html>

<html>


<head>

    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

    <title></title>

    <script src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>

    <style>

    .left,

    .right {

        width: 300px;

        height: 120px;

    }

    

    .left div,

    .right div {

        width: 100px;

        height: 90px;

        padding: 5px;

        margin: 5px;

        float: left;

        border: 1px solid #ccc;

        background: #bbffaa;

    }

    </style>

</head>


<body>

    <h2>通过clone克隆元素</h2>

    <div class="left">

        <div class="aaron1">点击,clone浅拷贝</div>

        <div class="aaron2">点击,clone深拷贝,可以继续触发创建</div>

    </div>

    <script type="text/javascript">

        //只克隆节点

    //不克隆事件

    $(".aaron1").on('click', function() {

       // $(".left").append( $(this).clone().css('color','red') )

       $(".arron1").clone()

    })

    </script>


    <script type="text/javascript">

    //克隆节点

    //克隆事件

    $(".aaron2").on('click', function() {

            console.log(1)

        $(".left").append( $(this).clone(true).css('color','blue') )

    })

    </script>

</body>


</html>


写回答 关注

2回答

  • 旺仔窝窝头
    2019-12-16 09:52:04
    已采纳

    我的理解(以克隆"aaron1"为例):若将"this"改为"aaron1",$(".arron1").clone()表示克隆所有类名为"aaron1"的元素,第一次点击"aaron1"时克隆出一个,此时共有2个"aaron1"的元素,再次克隆则会对这两个"aaron1"都克隆一次,所以当你第二点击克隆时就是克隆出2个"aaron1",以此类推。而"this"指代当前对象,即只克隆当前这一个拥有克隆点击事件的对象。

  • 慕无忌4172087
    2020-03-30 16:58:27

    因为在jquery中,对象是一个元素集合啊;你第一次点击前,arron2集合中只有一个元素;第二次点击前,aaron2中有2个元素;第三次,有4个元素;依次类推。

jQuery基础(二)—DOM篇

jQuery第二阶段开启DOM修炼,了解创建、插入、删除与替换

114012 学习 · 590 问题

查看课程

相似问题