如何在 jQuery .html() 中选择 class="*"

Question

如何在从 .html() 返回的代码中选择类（或任何其他）string="*" ？

如果我们将元素的 html 写入另一个元素（作为文本）。 （如带有预览的 sn-p）

<div class="myClass">1</div>
<div class="myElem">2</div>
<div class="myBox">3</div>

这些 div 不是对象，而是文本，所以：

<div class="myClass"> 1 </div>
<div class="myElem"> 2 </div>
<div class="myBox"> 3 </div>

如何选择字符串“class”及其值/内容并替换为<strong> + string + </strong>，例如突出显示此html代码中的某些内容（实际上是文本）。

class="myClass"
class="myElem"
class="myBox"

类似于class=" * " ...

这样我就可以选择和替换了：

var string = "class=*"
var regex = new RegExp(string, 'gi');
var text = $("#htmlCode").html().replace(regex, '<span class="strong">' + string + '</span>');
$("#htmlCode").html(text);

Answer 1

这将是您正在寻找的代码：

$(function(){
  var $context = $("#context");
  var regex = /(<div[\s]*class=\"[^\"]*\">)([^<]*)(<\/div>)/gmi;
  $context.html($context.html().replace(regex, '$1<strong>$2</strong>$3'));
});

strong{
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="context">
  <div class="myClass">1</div>
</div>

但老实说，使用.html() 会

1. 销毁事件
2. 触发 DOM 重新生成

既然你提到了：

例如突出显示

我建议使用mark.js 而不是以这种方式实现高亮组件。