使用jQuery，如何修改標籤外的文本？

Question

給定了一個文本字符串，它們都與一個範圍和一個div的內部相鄰，那麼修改該文本的方法有哪些，讓周圍的HTML保持不變？例如：像

$('#my-div').html(function(i, elem){blah;}); 

<div id="my-div">modify this text<span id="my-span"></span></div> 

我已經試過的事情，但是這似乎導致要刪除的跨度和新跨越添加（我注意到有些造型是失去了對跨度）。

我意識到在應用客戶端代碼之前，最好將文本字符串包裝在自己的HTML標記中，但這是我無法控制的。

Answer 1

這似乎工作：

$('#my-div').contents() 
      .filter(function() { return this.nodeType == 3; }) 
      .replaceWith('new text or html'); 

的nodeType == 3是測試一個文本節點。

Answer 2

而不是修改它的HTML字符串，修改它的DOM樹，找到頂級文本節點，並與他們做。

Answer 3

如何使用jQuery的contents()方法？

http://api.jquery.com/contents/

Answer 4

你可以只使用字符串替換：

HTML

<div id="my-div">modify this text <span id="my-span">or this text here</span></div> 

腳本

$('#my-div').html(function(i,html){ 
return html.replace('this text', 'some new text').replace('or this text', 'and replace this text'); 
}) 

Answer 5

你嘗試過這樣的：

$(document).ready(function(){ 

    var elems = $('#myDiv *').detach(); 

    $('#myDiv').text('new texts...').append(elems); 

})​ 

快速demo

編輯

或亞歷克斯建議使用.contents()：

$('#myDiv').contents() 
    .filter(function(){ 
     return this.nodeType != 1 && $.trim($(this).text()) != '';   
    }) 
    .replaceWith("I am the new text");