利用键值对来找对应值的信息

css

  .modeWin{ 300px;height: 200px;border: 1px solid #000;margin-bottom:30px;}
.contant div{
     300px;height: 200px;
    font-size: 16px;color:pink;
    border: 1px solid #000;
}
.contant div p{cursor:pointer;}

.btnshow{position:absolute;right:20px;top:20px;}

p{cursor:pointer;}

html

 <div class="modeWin">
                
            </div>

            <div class="contant">
                          <button class="btnJia" style="margin-bottom:10px;">+</button>
                   <div style="position:relative;">
                        <button onclick="btnjian(this)" class="btnshow" style="display:none">减去</button>
                         <p>我是第一个盒子</p>
                   </div>

                   <div style="position:relative;top:20px;">
                     <button onclick="btnjian(this)" class="btnshow"  style="display:none">减去</button>
                         <p>我是第二个盒子</p>
                   </div>
 </div>

javascript

 $('.btnJia').click(function(event) {
            $('.btnshow').show(300);
           
        });
var container = {}; //用这个键值对存储元素对应的此时父元素的值,一个对应关系
        function btnjian(self){
           var parentElemt = $(self).parent().html();
           var childP = $(self).parent().children('P').text();
           $(self).parent().hide(400);
           
           var flag = new Date().getTime();

           var pElemt = $('<p flag='+flag+' onclick="childp(this)">'+childP+'</p>');

          
           $('.modeWin').append(pElemt);
            container[flag] = parentElemt;
        }
     
      function childp(self){
        // alert()
        var flag = $(self).attr('flag');
        var box = $('<div style=position:relative;top:10px;bottom:10px;>');
        // console.log(container[flag])
        box.append(container[flag])
        $('.contant').append(box);
      }
原文地址:https://www.cnblogs.com/Model-Zachary/p/7053778.html