我正在尝试处理WordPress插件生成的内容,以使其与网站其余部分的样式匹配。每个数据块(一个页面上有30个块)具有许多带有各种类名的标签。
这是一个例子:
<div class="sa_widget_sermons_row">
<div class="sermon">
<div class="sa_widget_title">
Title_text
</div>
<div class="info">
Speaker_Name, Date | Series | Topic
</div>
</div>
</div>
...repeat again for the next set of data...
如果我使用类似以下jQuery的内容:
$('.sa_widget_sermons_row > .info').html($('.sa_widget_sermons_row > .info').html().replace(/\|/g, '<br/>'));
...取代了| 但会在每个div.info中放入相同的数据(第一组)。
我尝试使用each()函数无济于事。并在上述目标参数中使用“ this”将其破坏。
我如何获取它来检索内部html,对其进行处理并将其放回原处?
注意:如果有帮助的话-整个块集也都包装在div.sa_widget_content中。
您可以使用回调
$('.sa_widget_sermons_row .info').html(function(_, html) {
return html.replace(/\|/g, '<br/>');
});
或循环
$('.sa_widget_sermons_row .info').each(function() {
$(this).html( $(this).html().replace(/\|/g, '<br/>') );
});
定位每个元素,而不是一次定位所有元素。
请注意,这.info
不是的直接子项.sa_widget_sermons_row
,因此.sermon
它们之间有一个元素,因此请删除“直接子选择器”(>
)
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句