Question

给定一个与跨度和div内部相邻的文本字符串，有哪些方法可以修改该文本，使周围的HTML保持不变？例如：

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

我尝试过像

这样的事情

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

但这似乎会导致删除范围并添加新的范围（我注意到某些样式在范围内丢失）。

我意识到最好在应用客户端代码之前将文本字符串包装在自己的HTML标记中，但这是我无法控制的。

Answer 1

这似乎有效：

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

nodeType == 3用于测试文本节点。

Answer 2

使用jQuery的contents()方法怎么样？

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

Answer 3

你尝试过类似的事情吗？

$(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");

Answer 4

不是修改其HTML字符串，而是修改其DOM树，找到顶级文本节点并使用它们。

Answer 5

你可以使用字符串替换：

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

使用jQuery，如何修改标签之外的文本？

5 个答案: