Question

如果我有以下标记，如何更改父版本中的文本 - 使用javascript或jQuery？

<td class="cartItemTotal">
    <span>
        <span class="currency_sign">£</span>
        25.00
    </span>
</td>

我尝试了以下两个（基于two different SO问题），但两者都没有发生。

(1)

$this.find('.cartItemTotal > span').contents().filter(function(){
    return this.nodeType == 3;
}).filter(':first').replaceWith( itemTotal.toFixed(2) );

(2)

$this.find('.cartItemTotal > span')[0].firstChild.data = itemTotal.toFixed(2);

注意：“$this”是指表数据元素所在的<tr>。

Answer 1

jQuery确实不能很好地处理textNodes，但使用原生nextSibling可以获得.currency_sign元素后面的textNode：

$('.currency_sign').get(0).nextSibling.nodeValue = 'new value';

FIDDLE

我正在使用get(0)来获取集合中的第一个原生DOM元素。

Answer 2

与标记相比，您的选择器没有意义，但如果您可以访问.total > span，则可以获取DOM元素[0]，并使用.lastChild。

$(".total > span").each(function(i, el) {
    console.log(el.lastChild.data);
});

DEMO： http://jsfiddle.net/Y3m4b/

所以你的最后一个代码示例几乎就在那里。只需使用.lastChild代替.firstChild。

$this.find('.cartItemTotal > span')[0].lastChild.data = itemTotal.toFixed(2);

Answer 3

您可以使用contents（）和filter（）来获取textNodes。

var node = $(".cartItemTotal>span").contents().filter(function() {
        return this.nodeType == 3;
    });
node.last().replaceWith( document.createTextNode( "1.99" ));

跑步小提琴：http://jsfiddle.net/eSemE/

更改跨度的文本，使孩子不受影响

3 个答案: