[英]jQuery prependTo() selector
I have a code like this: 我有这样的代码:
<div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div> <div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div>
I want to get the ca_title
div and move it into the photo_room_f
div for every usa_img_bg
. 我想获取
ca_title
div并将其移到每个usa_img_bg
的photo_room_f
div中。
I use this code: 我使用以下代码:
$.each($('.usa_img_bg'), function(index, element) { $(element).children(".ca_title").prependTo(".photo_room_f"); });
but it gets me all titles and puts them all on every usa_img_bg
div. 但这会带给我所有标题,并将它们全部放在每个
usa_img_bg
div上。 How can I make it get only the ca_title
that's in every single usa_img_bg
? 我怎样才能使它只得到
ca_title
这是在每一个usa_img_bg
?
Thanks in advance! 提前致谢!
The selector you're using inside prependTo
is a standard jquery selector and it doesn't know you're only interested in the current element
, so it will be returning ALL elements on the page with a class of photo_room_f
. 在
prependTo
内部使用的选择器是一个标准的jquery选择器,它不知道您仅对当前element
感兴趣,因此它将返回页面上所有带有photo_room_f
类的photo_room_f
。
Try something like this: 尝试这样的事情:
$.each($('.usa_img_bg'), function(index, element) {
var $el = $(element);
$el.children(".ca_title").prependTo($el.find(".photo_room_f"));
});
The issue in your code is that you are appending to all the .photo_room_f
elements, you need to find()
the one related to the .usa_img_bg
of the iteration. 代码中的问题是,您要追加到所有
.photo_room_f
元素,因此需要find()
与迭代的.usa_img_bg
相关的.usa_img_bg
。 Try this: 尝试这个:
$('.usa_img_bg').each(function(i, e) { var $room = $(this).find(".photo_room_f"); $(this).find(".ca_title").appendTo($room); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div> <div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div>
Try this: 尝试这个:
$.each($('.usa_img_bg'), function() {
$(this).children(".ca_title").prependTo($(this).find('.photo_room_f'));
});
Try utilizing context
parameter of jQuery()
尝试利用
jQuery()
context
参数
.prependTo($(".photo_room_f", element));
where element
is context
: .usa_img_bg
其中
element
是context
: .usa_img_bg
$.each($(".usa_img_bg"), function(index, element) { $(element).children(".ca_title").prependTo($(".photo_room_f", element)); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div> <div class="usa_img_bg"> <div class="ca_title">Lorem Ipsum</div> <div class="img_box"> <div class="photo_room_f"> <p>Lorem Ipsum dolor si amet...</p> </div> </div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.