Изменение всего текста в DIV с JQuery

Question

У меня есть структура вроде так:

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

Как я могу заменить только «Какой-то текст здесь идет», не затрагивая controls DIV?

Очевидно, еще один div может быть добавлен вокруг «Некоторый текст идет здесь», а затем его содержимое заменено, но ради этого вопроса предполагаем, что я не могу.

Answer 1

Это можно сделать без изменения существующего HTML. Просто используйте jQuery, чтобы найти текстовый узел, а затем измените его значение, напрямую обратившись к DOM.

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

Смотрите документацию JQuery для .contents() и документации MDN для .nodeValue.

Answer 2

Вместо «div» вокруг текста, может быть, span, поэтому он является встроенным. Или используйте:

<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 для поиска controls DIV, а затем преобразовать его в DOM узел и использовать родной JS для изменения текста

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

DEMO: http://jsfiddle.net/tmGDW/