从DIV内容

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 s的nodeValue。

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

http://jsfiddle.net/zb8j43cu/