1.交换内容
$("#btn").on("click",function(){
//方法一
var srcOne = $("img").eq(0).attr("src");
var srcTwo = $("img").eq(1).attr("src");
$("img").eq(0).attr("src",srcTwo);
$("img").eq(1).attr("src",srcOne);
//方法二
// var imgclone = $("img").eq(0).clone();
// imgclone.insertAfter($("img").eq(1));
// $("img").eq(0).replaceWith($("img").eq(1));
})
2.元素拖动
<script>
$(function(){
$("#box").mousedown(function(e){
var disX= e.pageX - $(this).offset().left;
var disY= e.pageY - $(this).offset().top;
console.log(disX+"----"+disY);
$(document).mousemove(function(e){
$("#box").css({left:(e.pageX-disX)+"px",top:(e.pageY-disY)+"px"});
});
$(document).mouseup(function(){
$(document).off("mousemove");
})
})
})
解析:
$().offset().left :获得元素的left值
$().offset().top :获得元素的top值
事件绑定用on;事件解绑用off;
$(node).on("事件类型",“绑定元素”,fn)
$(node).off("事件类型")
注:此方法可以用来实现滑动解锁