jquery移动元素位置

ele.parent() : 获取一个元素的临近的父级
ele.prev() :获取在其上面的临近兄弟节点
ele.next() :获取在其下面的临近的兄弟节点
ele.before(): 设置元素的前一元素是什么
ele.after():设置元素的后一元素是什么

js:
<script type="text/javascript">
$(document).ready(function(){
$("#btnPrevious").bind("click",function(){ toPrevious(); })
$("#btnAfter").bind("click",function(){ toAfter(); })
});
function toPrevious(){
$("#div2").prev().css("background", "yellow");
      $("#div2").prev().before($("#div2"));
}
function toAfter(){
      $("#div2").next().after($("#div2"));
}
</script>

HTML:
<body>
<div>
<div id="div1">11111</div>
<div id="div2">22222</div>
</div>
<div>
<input type="button" id="btnPrevious" value="向前" />
<input type="button" id="btnAfter" value="向后"/>
</div>
</body>
</html>


补充:
也可使用$("# div1").insertAfter($("# div2"));
$("# div2").insertBefore($("# div1"));

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值