更改 hover / Javascript 中的工具提示文本

Question

我正在尝试使用 JavaScript 更改 blankSpace 和 hoverHint 的值，但是更改 blankSpace 会完全删除 hoverHint 的 HTML ... 可以理解。 有什么办法可以解决这个问题，只需编辑其中每一个的文本值吗？

<div class="tooltip" id="blankSpace">Hover over me
 <span class="tooltiptext" id="hoverHint">Tooltip text</span>
</div>

和 JS：

document.getElementById("blankSpace").textContent = "___";
document.getElementById("hoverHint").textContent = hintText;

Answer 1

您可以使用childNodes访问文本节点并替换其中的值：

document.querySelector('#blankSpace').childNodes[0].nodeValue = 'new text';

document.querySelector('#blankSpace')将 select 这个 div。 第一个childNode将是您的文本节点，您可以通过为其nodeValue分配新值来编辑它