从 div 内容中仅删除 <br />

Question

我正在使用 WooCommerce 并且必须包括

    <br>

在产品名称中。

此中断现在显示为

    <br />

在 .woocommerce-面包屑中。

这是面包屑的样子：

    <nav class="woocommerce-breadcrumb" itemprop="breadcrumb">
        <a href="http://localhost/WP">Home</a>
        &nbsp;&#47;&nbsp;
        <a href="http://localhost/WP/product-category/guitars/">Guitars</a>
        &nbsp;&#47;&nbsp;
        <a href="http://localhost/WP/product-category/guitars/electric-guitars/">Electric Guitars</a>
        &nbsp;&#47;&nbsp;
        <a href="http://localhost/WP/product-category/guitars/electric-guitars/fender-electric-guitar/">Fender-123-electric-guitar</a>
        &nbsp;&#47;&nbsp;Fender American Standard&lt;br /&gt; Stratocaster Sienna Sunburst
    </nav>

如您所见，导航栏前的最后一行包含在浏览器中看起来像字面意思的分隔符< br/>

目前我正在尝试摆脱它，但它破坏了面包屑的功能！

  $(function() {
      $( '.woocommerce-breadcrumb' ).text(function(_,txt) {
          return txt.split('<br />').shift();
      });
  });

有什么建议吗？

谢谢！

Answer 1

text 方法是 破坏性的 ，即它会重置元素的内容。您可以遍历 childNodes 并修改 textNode 的 nodeValue。

$( '.woocommerce-breadcrumb' ).contents().each(function() {
    if ( this.nodeType === 3 ) {
       this.nodeValue = this.nodeValue.replace(/<br \/>/g, '');
    }
});

http://jsfiddle.net/zb8j43cu/

从 div 内容中仅删除 <br />

remove only <br /> from div content

html

css

wordpress

jquery

woocommerce