编程语言
首页 > 编程语言> > javascript – 如何更改ul中的li文本而不更改其他属性?

javascript – 如何更改ul中的li文本而不更改其他属性?

作者:互联网

我有一个像下面这样的人.

<li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window">Navigate Window</li>

我尝试使用以下代码更改此li的文本.

$('#list1 #' + selectedId).text('abcd');

使用此代码,文本正在改变.但它失去了李的输入.如何防止更换整个li?

而且我在stackoverflow中尝试了以下内容.
change just text in li that contains img

我尝试过如下,

$("ul.list-group > li.list-group-item > span.thetext").html('abcd');

我的ul类是list-group.但我失败了.怎么办呢?

提前致谢!

解决方法:

最简单的解决方案是将文本包装在一个范围内,然后使用类似的选择器更改范围的内容

var selectedId = '1909';
$('#list1 #' + selectedId + ' span').text('abcd');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="list1">
  <li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window"><span>Navigate Window</span></li>
</ul>

如果那是不可能的,那么根据您的标记,您需要更改您的最后一个孩子的内容

var selectedId = '1909';
$('#list1 #' + selectedId).contents().last().text('abcd');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul id="list1">
  <li class="list-group-item" data_id="1909" id="1909"><input type="checkbox" class="checkboxes" value="1909" name="Navigate Window"><span>Navigate Window</span></li>
</ul>

标签:jquery,javascript,html-lists,html
来源: https://codeday.me/bug/20190609/1207435.html