用jQuery替换HTML页面中的文本

您所在的位置：网站首页 › jquery替换 › 用jQuery替换HTML页面中的文本

用jQuery替换HTML页面中的文本

2023-04-11 04:49| 来源: 网络整理| 查看: 265

如何替换jQuery中的任何字符串？

假设我有一个字符串"-9o0-9909"，我想用另一个字符串替换它。

相关讨论在问问题之前如何使用jQuery将HTML块替换为HTML块的可能重复，最好检查一下系统在输入问题标题时提出的自动建议您能否详细说明为什么您认为jquery是必经之路-到目前为止的答案可能不正确。我可以在c＃页面，javascript，数据库和html页面中更改文本，但是我在考虑是否有可能在页面加载后使用jquery来实现。我正在尝试节省时间并学习新的东西:)

您可以使用以下内容替换页面正文中第一个出现的单词：

12var replaced = $("body").html().replace('-9o0-9909','The new string'); $("body").html(replaced);

如果要替换所有出现的单词，则需要使用正则表达式并将其声明为全局/g：

12var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string'); $("body").html(replaced);

如果您想要一个班轮：

1$("body").html($("body").html().replace(/12345-6789/g,'abcde-fghi'));

您基本上是将页面标记内的所有HTML都带入一个字符串变量，使用replace()查找并用新字符串更改首次出现的找到的字符串。或者，如果您要查找并替换所有出现的字符串，请在混合中引入一些正则表达式。

在此处查看演示-在左上方查看HTML，以查看原始文本，下方的jQuery和右下方的输出。

相关讨论代码工作得很好，谢谢scoobler。 jQuery(function($){var replace = $(" body")。html()。replace(/ 12212-522-1212 / ig，2121-2121-0000); $(" body")。html(replaced) ;}); 我认为这不是非常有效...我们应该寻找更好的解决方案！该解决方案不好，因为它更改了HTML DOM。它正在替换完整的HTML，因此重新插入了页面上的所有内容，这对于简单的网站来说还不错，但是如果您有很多JavaScript，随着DOM的更改，它们将被破坏。除了是一个好的解决方案之外，$(" body")。html()将没有body标签。如果您打算替换body标签或其属性上的某些内容，请使用externalHTML。是的，这样做会重新触发页面上的脚本；除了最简单的情况外，它不是解决所有问题的通用解决方案。

就像该线程中提到的其他内容一样，替换整个HTML主体不是一个好主意，因为它会重新插入整个DOM，并有可能破坏作用于这些元素的任何其他JavaScript。

相反，使用jQuery过滤器仅替换页面上的文本，而不替换DOM元素本身：

12345 $('body :not(script)').contents().filter(function() { return this.nodeType === 3; }).replaceWith(function() { return this.nodeValue.replace('-9o0-9909','The new string'); });

this.nodeType是我们要替换其内容的节点的类型。 nodeType 3是文本。在此处查看完整列表。

相关讨论是的，这一个没有破坏javascript，而另一个没有破坏javascript，大大的进步！

...I have a string"-9o0-9909" and I want to replace it with another string.

下面的代码可以做到这一点。

123var str = '-9o0-9909'; str = 'new string';

除了玩笑，用JavaScript替换文本节点并非易事。

我写了一篇关于此的文章：用JavaScript替换文本。

相关讨论链接上的代码几乎可以处理所有情况。对我来说，它在集合中的上令人不快(child是null)，并且在splitText上还会发生莫名其妙的崩溃，其原因是"分割偏移超出了文本节点的长度"。同样，"画布"拼写为" cavas"。不过，+ 1。 @bishop谢谢，我绝对需要更新该帖子。别客气。我喜欢遵循您的代码这么短而又容易，我只是无法让它适应我的用例。我最终选择了padolseys的findAndReplaceDOMText库-重量更大，但涵盖了我能找到的所有常见情况。

html替换的想法很好，但是如果对document.body完成操作，页面将闪烁并且广告将消失。

我的解决方案： $("*:contains('purrfect')").each(function() { var replaced = $(this).html().replace(/purrfect/g,"purrfect"); $(this).html(replaced); });

查阅Padolsey关于DOM查找和替换的文章，以及实现所描述算法的库。

在此示例用法中，我用tel:方案链接替换了看起来像美国电话号码的中的所有文本：

12345678910findAndReplaceDOMText(document.getElementById('content'), { find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g, replace:function (portion) { var a = document.createElement('a'); a.className = 'telephone'; a.href = 'tel:' + portion.text.replace(/\D/g, ''); a.textContent = portion.text; return a; } }); 12var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string'); $("body").html(replaced);

对于变量：

12var replaced = $("body").html().replace(new RegExp("-1o9-2202","igm"),'The ALL new string'); $("body").html(replaced);

1$("#elementID").html("another string");

http://api.jquery.com/html/

相关讨论它们并不总是相同的id，可以是不同的类名或id名称。如果我只有1个班级名称或ID名称，那不是很难，但大多数时候都是随机的。因此，您想在整个HTML树中搜索一个字符串，然后替换它？

【本文地址】

用jQuery替换HTML页面中的文本

用jQuery替换HTML页面中的文本

今日新闻

推荐新闻