除了children标记之外，我如何获取parent-div的值

Question

<bdi>
<span class="woocommerce-Price-amount amount">$</span>
"75.47"
</bdi>

现在我想访问bdi值，该值仅为74.47，如何使用jquery获取它。这是我的jquery代码。

jQuery(document).ready(function($){
$('.qty').on('change',function(){
// grab the price
var price = $('bdi').children().not('span').html();
var total_price = price * this.value;
console.log(price, this.value, total_price);
});
})

Answer 1

您需要使用.text()方法只获取bdi，然后使用.replace删除美元符号$和双引号""。

此外，为了去除.trim()所需的额外空间，为了使用数学，我们需要使用parseInt方法将字符串转换为integar来进行multiplication，然后在console.log中获得总计value

实时演示：(完整工作代码(

jQuery(document).ready(function($) {
$('.qty').on('change', function() {
// grab the price
var price = $('bdi').text().replace("$", "").replace(/"/g, "").trim() //75.47
var total_price = parseInt(price) * parseInt($(this).val());
console.log(total_price); //some results after selecting the product
console.log(price ); //75.47
});
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="qty">
<option disabled selected>Choose</option>
<option value="25">Some Value 25</option>
<option value="75">Some Value 75</option>
</select>
<bdi>
<span class="woocommerce-Price-amount amount">$</span>
"75.47"
</bdi>

使用parseFloat方法确保2个数量的decimals100.9中的合计

现场演示：

jQuery(document).ready(function($) {
$('.qty').on('change', function() {
// grab the price
var price = $('bdi').text().replace("$", "").replace(/"/g, "").trim() //75.47
var total_price = parseFloat(price) * parseFloat($(this).val());
console.log(total_price); //some results after selecting the product
});
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="qty">
<option disabled selected>Choose</option>
<option value="2">Qty 2</option>
<option value="5">Qty 5</option>
</select>
<bdi>
<span class="woocommerce-Price-amount amount">$</span>
"50.45"
</bdi>

Answer 2

这里有一行代码。可能还有很多其他方法：

1. 克隆bdi元素
2. 从克隆中删除span
3. 使用end()返回到克隆的元素
4. 获取内部文本内容
5. 删除引号

const str = $('bdi').clone().find('span').remove().end().text().split('"')[1];
//                   ^ (1)                ^ (2).   ^ (3)  ^ (4) ^ (5)
console.log(str);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<bdi>
<span class="woocommerce-Price-amount amount">$</span>
"75.47"
</bdi>

Answer 3

$(选择器(.text((将返回不包含html代码的值。

Answer 4

尝试

var price = $('bdi').children().remove().end().text();

这将返回"75.47〃，您可以删除引号并转换为双