使用JQuery替换HTML页面上的特定字符串

StackOverflow https://stackoverflow.com/questions/1637269

  •  06-07-2019
  •  | 
  •  

题

我们正在提供一大堆HTML内容，以便导入并显示在其他人的页面上。页面的所有者在我们的内容blob周围添加了标题，但标题是我们提供内容的Web服务的名称，而不是我们想要向用户显示的用户友好名称。他们无法弄清楚如何更改标题，我们不想更改我们的Web服务的名称，并且它需要在几天内看起来很好。

理想的解决方案是让他们弄清楚如何使用他们的门户工具来自定义标题，但这不太可能在演示之前发生。所以我想我们可以在我们发送的内容中加入一些JavaScript，这会改变它们的标题。这会让他们花时间弄清楚他们在做什么。

标题代码如下：

<div class="titleClass"> Bad Title </div>

我想替换“Bad Title”与“好标题”。我想使用jQuery选择器在页面上找到这个文本，但不幸的是有多个div项目与titleClass类我只想更改其中一个....是否有一个我可以使用的选择器也将检查文字“Bad Title”在div标签里面？或者我是否必须编写一个单独的函数来遍历页面上的所有不同标题，并测试每个函数以查看它是否包含“错误标题”？如果我必须做第二个，是否有人有示例代码要分享？

有帮助吗？

解决方案

也许你想要做到更简单？ 

$(document).ready( function() {
  $('div.titleClass:contains("Bad Title")').text( "Good title" );
});

查看包含选择器。

其他提示

首先获得具有匹配文本的所有元素的集合：

var $matches = $('div.titleClass').filter(function() {
    return $(this).text() == 'Bad Title';
});

然后替换匹配元素的文本：

$matches.each(function() {
    $(this).text('New Title');
});

上面将查找文本完全匹配'Bad Title'的元素。如果您想要包含文本'Bad Title'的任何元素，例如'坏标题'，你应该使用 indexOf 或 search ，例如：

return $(this).text().indexOf('Bad Title') > -1;

最后一个警告是区分大小写。如果你想做一个不区分大小写的匹配，我建议像这样：

// the div contains Bad Title of whatever case
return $(this).text().search(/Bad Title/i) > -1;

// the div exactly matches Bad Title of whatever case
return $(this).text().search(/Bad Title/i) > == 0;
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top