Question

如何在不更改周围标签的情况下替换文本。 $（＆＃34; content＆＃34;）。text（＆＃34;一些新文字＆＃34;）将删除周围的标签。

<div id="content" style="height: 100%; width: 100%; padding: px;">
<p><strong>I need to be replaced</strong>
</p></div>

<div id="content" style="height: 100%; width: 100%; padding: 5px;">
<p><em><strong>I need to be replaced</strong></em></p>
</div>

Answer 1

如果您知道自己总是替换强标签中的文字，那么您可以这样做。否则，您可能必须创建某种业务规则，以确定要替换的内容块中的哪个元素。

$("#content strong").text("some new text")

如果您对封闭标签一无所知，除了可能有结构之外，您可以编写如下内容：

$.each($('.content'), function(i, val) {
  console.log($(val));
  replaceText(val, 'This is the updated text');
});

function replaceText(element, text) {
    if ($(element).children().size() == 0) {
       $(element).text(text);
       return;
    } 
    replaceText($(element).children()[0], text);
}

这将查找当前对象的子项，如果有子项，则向下移动第一个子项上的DOM树。现在，如果一个元素有多个子元素，并且您不知道要替换的是哪个子元素，那么您将需要做更多的工作来创建业务规则。

如果您知道要替换的部分或全部文本，也可以在CSS中使用内容选择器：

$('.content').find(':contains("I also need to be replaced")').text('Update text');

Link to jsFiddle

Answer 2

感谢您的解决方案，非常有帮助！

re：如果您知道要替换的部分或全部文本，也可以在CSS中使用内容选择器：

那是关键:)。 $（“＃content”）。text（）==我们要替换的内容，

您的解决方案很有效。我最终做到了这一点：

var content = $("#content").text();
$("#content").html($("#content").html().replace(content,"new text"));

谢谢！

替换文本而不改变布局的解决方案（jQuery）

2 个答案: