Замените только текст внутри div с помощью jquery

у меня есть div, как:

<div id="one">
       <div class="first"></div>
       "Hi I am text"
       <div class="second"></div>
       <div class="third"></div>
</div>

Я пытаюсь изменить только текст с "привет я текст" на "Привет я заменить" с помощью jquery. Это может быть легко, но я не в состоянии сделать это.

используя $('#one').text('') просто опустошает всю #One div.

6 87
javascript jquery

6 ответов:

текст не должен быть сам по себе. Положите его в span элемент.

измените его на это:

<div id="one">
       <div class="first"></div>
       <span>"Hi I am text"</span>
       <div class="second"></div>
       <div class="third"></div>
</div>

$('#one span').text('Hi I am replace');
115

найти текстовые узлы (nodeType==3) и заменить textContent:

$('#one').contents().filter(function() {
    return this.nodeType == 3
}).each(function(){
    this.textContent = this.textContent.replace('Hi I am text','Hi I am replace');
});

живой пример:http://jsfiddle.net/VgFwS/

92

вам нужно установить текст на что-то другое, чем пустая строка. Кроме того, В.функция html () должна делать это, сохраняя структуру HTML div.

$('#one').html($('#one').html().replace('text','replace'));
11

Если вы действительно знаете текст, который вы собираетесь заменить, Вы можете использовать

$('#one').contents(':contains("Hi I am text")')[0].nodeValue = '"Hi I am replace"';

http://jsfiddle.net/5rWwh/

или

$('#one').contents(':not(*)')[1].nodeValue = '"Hi I am replace"';

$('#one').contents(':not(*)') выбирает не-элемент дочерние узлы в этом случае текстовые узлы и второй узел-это тот, который мы хотим заменить.

http://jsfiddle.net/5rWwh/1/

7

на всякий случай, если вы не можете изменить HTML. Очень примитивный, но короткий и работает.

$('#one').text('Hi I am replace');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="one">
  <div class="first"></div>
  "Hi I am text"
  <div class="second"></div>
  <div class="third"></div>
</div>
1

другой подход-сохранить этот элемент, изменить текст, а затем добавить этот элемент обратно

const star_icon = $(li).find('.stars svg')
$(li).find('.stars').text(repo.stargazers_count).append(star_icon)
0