Remplacer uniquement le texte dans un div en utilisant jquery

J'ai un div comme:

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

J'essaie de changer uniquement le texte de "Salut je suis texte" à "Salut je suis remplacer" en utilisant jquery. Cela pourrait être facile mais je ne suis pas en mesure de le faire.

L' utilisation se $('#one').text('')jette tout l'ensemble #Onediv.

Le texte ne doit pas être isolé. Mettez - le dans un spanélément.

Changez-le en ceci:

<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');

Trouvez les nœuds de texte ( nodeType==3) et remplacez le textContent:

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

Exemple en direct: http://jsfiddle.net/VgFwS/

Vous devez définir le texte sur autre chose qu'une chaîne vide. De plus, la fonction .html () devrait le faire tout en préservant la structure HTML du div.

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

Si vous connaissez réellement le texte que vous allez remplacer, vous pouvez utiliser

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

http://jsfiddle.net/5rWwh/

Ou

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

$('#one').contents(':not(*)') sélectionne les nœuds enfants non élémentaires dans ce cas, les nœuds de texte et le deuxième nœud est celui que nous voulons remplacer.

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

Une autre approche consiste à conserver cet élément, à modifier le texte, puis à rajouter cet élément

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

Juste au cas où vous ne pouvez pas changer le HTML. Très primitif mais court et fonctionne. (Cela videra le div parent, donc les div enfants seront supprimés)

$('#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>