javascript - 当元素具有子元素并使用 JQuery 时，如何仅在 HTML 中更改文本？

Question

对于以下代码：

<div myLable="a"><p><span style="color:#00aaFF">change me only 1</span></p></div>
<div myLable="b"><span style="color:#00aaFF">change me only 2</span></div>

如果我使用

$('div[myLable="a"]').text("change");
$('div[myLable="b"]').text("change");

然后里面的所有html代码都会改变，这不是我需要的。

注意有两个前置条件：

1. 子元素中没有任何标签或 id。
2. 我们不知道子元素有多深，可以得出的结论是要求更改最深的子元素的文本。
3. 如果在解决方案中使用原始 javascript 会很好，但必须使用$('div[myLable="a"]')表单，因为父元素没有 id 而只有一个用户定义的标签，所以我需要这个 Jquery 表单。

仅在这种情况下如何更改文本？

提前致谢，

哇

Answer 1

您需要更改span. 所以使用适当的选择器指向span：

$('div[myLable="a"] span').text("change");

Answer 2

var $target = $('div[myLable="a"]').children();
$next = $target;

while( $next.length ) {
  $target = $next;
  $next = $next.children();
}

$target.text("change");