javascript - 使用 jQuery 仅更改 div 中的文本

Question

我有这样的结构：

<div class="comment">
    Some text goes here.
    <div class="controls">
      Controls go here.
    </div>
</div>

如何在不影响controlsdiv 的情况下仅替换“这里有一些文本”？

显然，可以在“这里有一些文本”周围添加另一个 div，然后替换它的内容，但是为了这个问题，假设我不能。

Answer 1

这在不修改现有 HTML 的情况下是可能的。只需使用 jQuery 找到文本节点，然后通过直接访问 DOM 来更改其值。

$('.comment').contents()[0].nodeValue = 'Some other text goes here.';

请参阅.contents()的 jQuery 文档和.nodeValue的 MDN 文档。

Answer 2

而不是文本周围的“div”，可能是一个跨度，所以它是内联的。或使用：

<div class="comment">
    Some text goes here.
    <div class="controls">
      Controls go here.
    </div>
</div>
<script>
    var c = $('.comment').eq(0);
    c.html(c.html().replace('Some text goes here', 'Blah blah blah'));
</script>

Answer 3

我会这样：

$(function() {
    var children = $('.comment').children();
    $('.comment').text('har').append(children);
});​

Answer 4

使用jQuery定位controlsdiv，然后将其转换为DOM节点并使用原生JS更改文本

var textNode=$('.comment').find('.controls')[0].previousSibling
    textNode.nodeValue='New Text From Script'

演示：http: //jsfiddle.net/tmGDW/