在页面上,我需要检测其中包含图像的所有条目,并向H1和img添加样式,并在这些条目中包含img。到目前为止没问题。
<div class="entry">
<h1>Headline</h1>
<p><img></p>
</div>
$("div.entry img").closest(".entry").find("h1").addClass("home-h1-adjust");
$("div.entry img").closest("p").addClass("home-p-img-adjust");
为了完全解决我面临的问题,我需要分离h1或p,然后重新插入到p1之前的p所在的位置,这是一系列条目,并非所有条目都有一个图像。
我陷入了正确的循环方式,并在jQuery中添加了分离的元素。感谢。
答案 0 :(得分:1)
$('.entry > p').each(function() {
$(this).insertBefore(this.previousElementSibling);
});
答案 1 :(得分:1)
//for each entry
$('div.entry').each(function(){
var $this = $(this);
//if entry has img
if($this.find('img').length > 0) {
//jQuery is chainable, and detaching is done automatically
$this.find('h1').addClass('home-h1-adjust')
.before($this.find('p').addClass('home-p-img-adjust'));
}
});
答案 2 :(得分:1)
$('div.spacer a').addClass('test').each(
function(){
$(this).remove();
}
);
您可以使用.each()
打开Chrome控制台并使用它。上面的示例删除了此页面上的每个相关链接。当然,您可以var element = $(this).detach();
然后element.appendTo('YOUR POSITION')
答案 3 :(得分:0)
以下是有效的解决方案:遍历页面上的所有条目,查找图像,将类附加到H1和第一个p标记。将包含H1上方图像的p作为条目div的第一个子节点。
<div class="entry">
<h1>Headline 1</h1>
<p><img />Image? Yes</p>
<p>Some Text that needs to stay put</p>
<p>More copy text</p>
</div>
<div class="entry">
<h1>Headline 2</h1>
<p>Text in a non image entry</p>
<p>This text has no image to keep it company</p>
</div>
$('div.entry').each(function(){
var $this = $(this);
if($this.find('img').length > 0) {
$this.find('h1').addClass('home-h1-adjust');
var $img = $this.find('p').first().addClass('home-p-img-adjust');
$this.prepend($img);
}
});