Question

我的结构是：

<th>0.12345<div id="someDiv"></div></th>

我需要将0.123456替换为其他文本，而不删除div。使用innerHTML和innerText会杀死所有内容。

我知道我可以先使用substr()剪切innerHTML，然后重新构建完整的内容，但有最简单的方法吗？

Answer 1

您需要选择TextNode对象并重置其nodeValue。现在该怎么做。你可以从div开始，因为你知道它是id。然后你可以获得带有previousSibling属性的textNode。

这样的事情：

document.querySelector('#someDiv').previousSibling.nodeValue = 'TEST'

<table>
    <tr>
        <th>0.12345 <div id="someDiv">div</div></th>
    </tr>
</table>

<强> UPD 即可。如果您想在div之前插入新文本节点并支持这两种方案，您可以这样做：

var div = document.querySelector('#someDiv');

if (div.previousSibling) {
    div.previousSibling.nodeValue = 'TEST1';
}
else {
    div.insertAdjacentHTML('beforebegin', 'TEST2');

    // or if you want verbose
    // div.parentNode.insertBefore(document.createTextNode('TEST2'), div);
}

Answer 2

＆＃13;

var th = document.getElementsByTagName('th')[0];
th.childNodes[0].textContent = "foo";

＆＃13;

<table><th>0.12345<div id="someDiv">somediv</div></th></table>

＆＃13;

不幸的是，jQuery并没有为文本节点提供很好的支持，所以你应该使用childNodes或XPath手动获取它。

Answer 3

我会在span标记中包含您需要的内容，并为了简单起见直接操作它。

HTML：

<th>
    <span class="myValue">0.12345</span> 
    <div id="someDiv">div</div>
</th>

JS：

$(".myValue").html("XXX");

如何在不扰乱其他子节点的情况下替换HTML节点中的文本？

3 个答案: