Question

在我wordpress project我使用短代码显示产品列表。我在下面添加了html。

<article class="teaser product tepr prio ">
<a href="http://localhost/svenskkinesiska/resor/sichuans-parlor/">
<div class="itemwrap">
<img class="img-responsive " src="http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-373x239-c-center.png" srcset="http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-530x340-c-center.png 768w, http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-767x492-c-center.png 1400w" alt="SICHUANS PÄRLOR" />
<div class="itemtextwrap">
<div class="teprb">
<div class="middlecenter">
<h3><span>Sichuans pärlor</span></h3>
</div>
</div>
<span class="duration">8 DAGAR - </span><span class="price">fr 1:-</span></div>
<div class="cprice_cdays small">
<div class="tableBased">
<div class="tableCelled"><span class="cprice">8 dagar, pris från </span><span class="cdays">1</span></div>
</div>
</div>
</div>
</a></article>

但它带有额外的p标签，如下所示。我尝试了wpautop但无济于事。怎么解决这个？欢迎任何帮助/建议。

<article class="teaser product tepr prio ">
<a href="http://localhost/svenskkinesiska/resor/sichuans-parlor/"></p>
<div class="itemwrap">
<img class="img-responsive " src="http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-373x239-c-center.png" srcset="http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-530x340-c-center.png 768w, http://localhost/svenskkinesiska/wp-content/uploads/2016/12/banner2@2x-1920x740-c-center-767x492-c-center.png 1400w" alt="SICHUANS PÄRLOR" /></p>
<div class="itemtextwrap">
<div class="teprb">
<div class="middlecenter">
<h3><span>Sichuans pärlor</span></h3>
</div>
</div>
<p><span class="duration">8 DAGAR - </span><span class="price">fr 1:-</span></div>
<div class="cprice_cdays small">
<div class="tableBased">
<div class="tableCelled"><span class="cprice">8 dagar, pris från </span><span class="cdays">1</span></div>
</div>
</div>
</div>
<p></a></article>

Answer 1

您可以使用jquery执行此操作：

$("b").each(function() {
$(this).replaceWith(this.childNodes);
});

注意：这会保留.text（）可能会对其进行转换的任何HTML内容。如果你想完全剥离，你可以使用：

$("p").html(function(i,h){ return h.replace(/<b>/g,'').replace(/<\/b>/g,''); });

或result = str.replace(/(<p[^>]+?>|<p>|<\/p>)/img, "");

或试试这个：

 `var str = "Some awesome text with a <p class='myClass'>new paragraph</p> and more text.";

    var $temp = $("<div>").html(str);
    $temp.find("p").each(function() { $(this).replaceWith(this.childNodes); });

    var output = $temp.html();`

如何删除p标签包装短代码中的每个html元素

1 个答案: