Question

我只想将标签替换为可用值。

但是在一个字符串中可能有多个相同的标签。

所以我需要获取和替换，

数组示例：

 var result = {
     '[name]':'user_name',
     '[age]':29
 };

字符串：

<p id="text">
Hi [name], I really want to thank you. 
You([name]), really done a great job.

user,
 [name]-[age]
</p>

Javascript ：

  var text = document.getElementByID('text');
  text.replace(string, value); // this replacement only helps first hit.

在这里，我使用＆＃34; [name]＆＃34; 3次，我有更换价值。

但我不能使用＆＃34; .replace（）＆＃34;函数，因为它不能在第二个标签上工作（如果相同）。

可能吗？

或解决此问题的任何其他解决方案？

先谢谢。

Answer 1

您可以使用捕获模式的正则表达式，然后使用将从对象获取值的函数。

var str = document.getElementById('text').innerHTML;
var result = {
  '[name]': 'user_name',
  '[age]': 29
};
var reg = /(?:^|\[)(.*?)(?:}|\])/g
str = str.replace(reg, function(s) {
  // if key exists in object, replace its value, do not replace anything
  return result[s] || s;
})

console.log(str)

<p id="text">
  Hi [name], I really want to thank you. You([name]), really done a great job. user, [name]-[age]. This is a [dummy] test case
</p>

Answer 2

从字符串生成正则表达式并替换为属性值。你可以使用RegExp从字符串生成正则表达式。

var result = {
  '[name]': 'user_name',
  '[age]': 29
};

var text = document.getElementById('text').innerHTML;
res = text.replace(
  // generate regex
  new RegExp(
    // get all keys from object
    Object.keys(result)
    // iterate and escape symbols which have special meaning in regex
    .map(function(v) {
      return v.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&');
    })
    // join using pipe symbol and set global modifier
    // for replacing all occurenece
    .join('|'), 'g'),
  // use callback to replace with value in object
  function(m) {        
  // get value from object if exist or return the same if not found
    return result[m] || m;
  });

console.log(res);

<p id="text">
  Hi [name], I really want to thank you. You([name]), really done a great job. user, [name]-[age]
</p>

参考：Converting user input string to regular expression

其他方法参考：

Object.keys
Array#map
Array#join
String#replace

UPDATE：如果模式相同，则使用简单模式匹配正则表达式并使用回调函数替换。

var result = {
  '[name]': 'user_name',
  '[age]': 29
};

var text = document.getElementById('text').innerHTML;
res = text.replace(/\[\w+\]/g, function(m) {
  // get value from object if exist or return the same if not found
  return result[m] || m;
})

console.log(res);

<p id="text">
  Hi [name], I really want to thank you. You([name]), really done a great job. user, [name]-[age]
</p>

Answer 3

或者更简单......这是[name]的示例，您可以根据需要添加字符串和值。

var text = document.getElementById('text').textContent;
text.replace(/\[name\]/g, 'Hello');

Answer 4

要在JavaScript中多次替换，您可以使用RegExp替换。

var text = document.getElementByID('text');
var regex= new RegExp(string,'gmi'); // g: global, m: multiline, i: ignore case
text.replace(regex, value);

如何在JavaScript中使用Preg_match来获取字符串中的匹配数？

4 个答案: