如何使用 JavaScript 更改标签的文本？ [复制]答案

【问题标题】：How to change the text of a label with JavaScript? [duplicate]如何使用 JavaScript 更改标签的文本？ [复制]
【发布时间】：2021-07-06 09:44:55
【问题描述】：

有一个标签和一个输入元素。

<div id="mydiv" class="my-div-class"><label id="id-label">abc<input type="text" id="id-text"></label></div>

现在我想更改标签的文本（例如从 abc 到 efg）

这不会改变它：

$('#id-label').html('efg');

这会使输入消失：

$('#id-label').html('efg');

$('#id-label').html('efg');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mydiv" class="my-div-class"><label id="id-label">abc<input type="text" id="id-text"></label></div>

【问题讨论】：

html(...) - 这会覆盖所选元素的内部 html。在您的情况下，由于input 是label 的子级，它会被覆盖。解决此问题的一种方法是使input 成为label 的兄弟元素。
您是否拥有多个具有相同 ID 的标签？
只有一个 ID 相同的标签。

标签： html jquery

【解决方案1】：

您的输入元素位于标签内，因此您将擦除内容

这样会更好

注意：如果标签不需要任何标记，请使用 .text() 而不是 .html

$('#id-label').text('Prompt: ');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mydiv" class="my-div-class">
  <label id="id-label" for="id-text">abc</label>
  <input type="text" id="id-text">
</div>

【讨论】：

如果只是设置为纯文本，最好使用.text('efg')。