Jquery选择html（）或text（）但不是嵌套的span和div

Question

我需要从div中选择价格，但问题是有时在元素中有一个额外的嵌套div和/或span。

我想知道是否有办法使用：not selector，或者我是否必须获取html的值并擦除有时存在的span和div。

$('.price').text();//returns the additional text from the span and div
$('.price').html();//returns the span and div tags and text

<!-- Simplified html -->
<div class="product">
<div class="price">$19.95
</div>
</div>

<!-- This product has shipping info inserted -->
<div class="product">
<div class="price"> $54.99
<div class="shipping-info">$5.99</div>
</div>
</div>

<!-- This product has the original price in a span and the shipping info inserted -->
<div class="product">
<div class="price"><span>$189.99</span>$99.99
<div class="shipping-info">Free Shipping</div>
</div>
</div>

我需要得到价格的价值（19.99美元，54.99美元，99.99美元），但不是额外的跨度或运输信息。

我无法更改HTML（只是脚本）。

Answer 1

var price = $('.price').contents().filter(function() {
    return this.nodeType == 3;   //Filtering by text node
}).text();

demo

Answer 2

这应该有效：

price.replace(/(<([^>]+)>.*?<\/([^>]+)>)/ig, "");

示例：

'$54.99<div class="shipping-info">$5.99</div>'.replace(/(<([^>]+)>.*?<\/([^>]+)>)/ig, "");