网站建设资讯

NEWS

网站建设资讯

怎么使用jQuery实现两个div中按钮互换位置

这篇文章主要讲解了“怎么使用jQuery实现两个div中按钮互换位置”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么使用jQuery实现两个div中按钮互换位置”吧!

创新互联公司是一家专注于成都网站制作、成都网站设计与策划设计,富锦网站建设哪家好?创新互联公司做网站,专注于网站建设十年,网设计领域的专业建站公司;建站业务涵盖:富锦等地区。富锦做网站价格咨询:13518219792

效果如下

怎么使用jQuery实现两个div中按钮互换位置 

代码如下:


 
 
 
 
  $(function() {
   //定义一个变量等于所有button按钮
   var btns = $("button");
   //for循环进行遍历 
   for(var i = 0; i < btns.length; i++) {
    //i控制他的下标确定的是那个按钮的点击事件
    btns[i].onclick = function() {
     //判断如果此按钮的父控件是div1
     if($(this).parent().is("#div1")) {
      //移除此按钮
      $(this).remove();
      //转移到div2
      $(this).appendTo("#div2")
     } else {
      //否则他的父控件是div2 那么就把他移动到div1
      $(this).appendTo("#div1")
     }
    }
   }
  });
 



 
  

我选择的:

 
    

还可以选:

                               

感谢各位的阅读,以上就是“怎么使用jQuery实现两个div中按钮互换位置”的内容了,经过本文的学习后,相信大家对怎么使用jQuery实现两个div中按钮互换位置这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是创新互联,小编将为大家推送更多相关知识点的文章,欢迎关注!


网站栏目:怎么使用jQuery实现两个div中按钮互换位置
文章路径:http://cdweb.net/article/pphojs.html

其他资讯