如下HTML:<!------------原来的HTML----------------><divclass="item"><divclass="order">50</div><divclass="rating"><divclass="rating-box">*****</div></div></div><divclass="...
如下HTML:
<!------------原来的HTML---------------->
<div class="item">
<div class="order">50</div>
<div class="rating">
<div class="rating-box">*****</div>
</div>
</div>
<div class="item">
<div class="order">33</div>
<div class="rating">
<div class="rating-box">*****</div>
</div>
</div>
<div class="item">... ...</div>
<!-----------希望用jQuery改成下面这样----------------->
<div class="item">
<div class="rating">
<div class="rating-box">*****</div>
<div class="order">50</div>
</div>
</div>
<div class="item">
<div class="rating">
<div class="rating-box">*****</div>
<div class="order">33</div>
</div>
</div>
<div class="item">... ...</div>
首先你的找到分析你自己的需求,什么情况下需要将那个div移动到那个div的后面,你这里所有的div都是结构和类名都相同,所以更要找到规律。
找到规律之后直接使用after方法就可以了,例如:
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("#p2").after($("#p1"));
});
});
</script>
</head>
<body>
<p id="p1">This is a paragraph.</p>
<p id="p2">This is second paragraph.</p>
<button>把第一个p元素移动到第二个p元素后面</button>
</body>
如果55是第一个,33是第二个,可以这样写。。。。
首先你的引用jquery库,然后加上
<script type="text/javascript">
$(document).ready(function(){
var div1=$("div.item").eq(0);
var div2=$("div.item").eq(1);
div2.after(div1);
});
</script>
越说越复杂了
就添加我写的那段js代码就行