Question

我在JavaScript / JQuery中有一个字符串，我想只替换不在HTML标记中的值：

< div class="myClass contentTab" id="myId">
  this is my content and I will work only on this 
</div>

我想用<b> + content + </b>替换HTML标签中的单词内容，而不是单词。结果应该是：

< div class="myClass contentTab" id="myId">
  this is my <b>content</b> and I will work only on this 
</div>

div contentTab的类不应被替换，而应替换“content”一词。

Answer 1

您只需使用以下代码：

var temp = "<div class='myClass contentTab'id='myId'>  this is my content and I will   work only on this </div>";
$('body').append($(temp));
var req = temp.match(/>(.*?)</g);
var beforeresult = temp.match(/>(.*?)</g);
var afterresult = beforeresult[0].replace("content","<b>content</b>");
var aftertemp = temp.replace(beforeresult,afterresult);
$('body').append($(aftertemp));

参考这个小提琴：

Fiddle

Answer 2

对我来说，最好的解决方案是声明一个<span />元素，其中应该替换文本。

您可以看到此{/ 3>的demo

简而言之，我在容器文本中添加了<span>标记和文本输入。

<div class="myClass contentTab" id="myId">
  this is my <span id = 'text_replace'>content</span> and I will work only on this 
</div>

<input type = "text" id = "text_input" />
<button id = 'replacement'>Replace Text</button>

使用jQuery，我声明了两个事件侦听器，最终结果是span元素文本被替换为您想要的任何内容。

$("#text_input").on("click", function(){
  var text = $("#text_replace").text();
  $(this).val(text);
});

$("#replacement").click(function(){
  var inputVal = $("#text_input").val(); 
  $("#text_replace").text(inputVal);
});

如果您想在原始示例中添加粗体文字，那么使用.css("font-weight", "bold")也可以。

从char到char的正则表达式选择由chars分隔的区间

2 个答案: