jQuery查找并replacestring
我在网站上的某个地方有一个特定的文本，比方说“棒棒糖”，我想用“marshmellows”replace这个string的所有事件。 问题是，我不知道文本究竟在哪里。 我知道我可以做这样的事情：
$(body).html($(body).html().replace('lollypops', 'marshmellows')); 这可能会起作用，但我需要尽可能的重写HTML，所以我想像这样：
- searchstring
- find最接近的父元素
- 只重写最近的父元素
- 甚至replace这个属性，但不是全部，例如replace它在
class，而不是在src
例如，我会有这样的结构
<body> <div> <div> <p> <h1> <a>lollypops</a> </h1> </p> <span>lollypops</span> </div> </div> <p> <span class="lollypops">Hello, World!</span> <img src="/lollypops.jpg" alt="Cool image" /> </p> <body>
在这个例子中，“lollypops”的每个出现都将被replace，只有<img src="...将保持不变，而实际上被操纵的唯一元素是<a>和两个<span> s <span> 。
有谁知道如何做到这一点？
你可以做这样的事情：
$("span, p").each(function() { var text = $(this).text(); text = text.replace("lollypops", "marshmellows"); $(this).text(text); });
最好用文本标记所有需要用合适的类名检查的标签。
另外，这可能会有性能问题。 一般来说jQuery或JavaScript并不适合这种操作。 你最好在服务器端做。
你可以这样做：
$(document.body).find('*').each(function() { if($(this).hasClass('lollypops')){ //class replacing..many ways to do this :) $(this).removeClass('lollypops'); $(this).addClass('marshmellows'); } var tmp = $(this).children().remove(); //removing and saving children to a tmp obj var text = $(this).text(); //getting just current node text text = text.replace(/lollypops/g, "marshmellows"); //replacing every lollypops occurence with marshmellows $(this).text(text); //setting text $(this).append(tmp); //re-append 'foundlings' });
例如： http : //jsfiddle.net/steweb/MhQZD/
下面是我用来代替一些文字的代码，用彩色文字。 这很简单，把文本，并在一个HTML标签内取代它。 它适用于该类标签中的每个单词。
$('.hightlight').each(function(){ //highlight_words('going', this); var high = 'going'; high = high.replace(/\W/g, ''); var str = high.split(" "); var text = $(this).text(); text = text.replace(str, "<span style='color: blue'>"+str+"</span>"); $(this).html(text); });
为什么你只是不向string容器添加一个类，然后replace内部文本？ 就像在这个例子中一样。
HTML：
<div> <div> <p> <h1> <a class="swapText">lollipops</a> </h1> </p> <span class="swapText">lollipops</span> </div> </div> <p> <span class="lollipops">Hello, World!</span> <img src="/lollipops.jpg" alt="Cool image" /> </p>
jQuery的：
$(document).ready(function() { $('.swapText').text("marshmallows"); });
