javascript - 找到出现的字符串并用跨度将其包裹起来

Question

<div id="wrapper">
  <div>if(true)<span class="openParen bm1">{</span></div>
  <div>cout<<"hey";cin>>x;</div>
  <div><span class="closeParen bm1>}</span></div>
</div>

我想使用正则表达式找到cout，例如/cout[^;]*;/，然后用span将其包装起来.

<div id="wrapper">
  <div>if(true)<span class="openParen bm1">{</span></div>
  <div><span id="group">cout<<"hey";</span>cin>>x;</div>
  <div><span class="closeParen bm1>}</span></div>
</div>

我将如何找到正则表达式的出现并用跨度将其包裹起来？请问有人吗？

更新:我在cout之后插入了cin>>x;，cin不应该被包装。

我想使用这样的东西

text.replace(/(cout[^;]*;)/g, '<span class="group">$1</span>');

但我不知道如何在 DOM 中应用它。有人吗？

BUG 对于 cin>> 和 cout<<，它们不能换行，直到 ; http://jsfiddle.net/3N4AE/11/

Answer 1

这是使用 jQuery 将正则表达式应用到 DOM 的方法:

$('#wrapper div').filter(':contains("cout")').each(function () {
    $(this).html($(this).text().replace(/(cout[^;]*;)/g, '<span class="group">$1</span>'));
});

<强> Demo fiddle