Question

我有一个名为Sport的数组，有近20项，我需要用全局替换（/ string / g）替换图像HTML字符串，我的字符串包含HTML标记。这是一个例子：

//Sports array
var sport = ['soccer','tennis','pool','basketball'];

//Original string
var original = 'Hello, do you play <img width="20" src="img/soccer.png"/> ?';

//New string
var newstring;

//If original string contains an image html of some sports from array,replace with :sport[item]:
for (var i = 0; i < sport.Length; i++)
{
   newstring = original.replace('/<img width="20" src="img\/icons\/'+sport[i]+'.png"/>/g',':'+sport[i]+':');
}

所以，回顾一下......我需要替换这个

<img width="20" src="img/soccer.png"/>

到此

:soccer:

结果应该是：你好，你玩的是：足球：？

Answer 1

你必须替换它：

newstring = original.replace('/<img width="20" src="img\/icons\/'+sport[i]+'.png"/>/g',':'+sport[i]+':');

到此：

newstring = original.replace(new RegExp('<img width="20" src="img\/icons\/'+sport[i]+'.png"\/>', 'g'),':'+sport[i]+':');

因为你无法在＆＃34; inline＆＃34;中连接字符串。正则表达式（如果有人知道正确的名称，请发表评论）：

// no quotes around pattern
newString = myString.replace(/pattern/g, "foo")

您应该看一下这个答案：Replacing all occurrences of a string in JavaScript

编辑：

如果您遇到特殊字符的麻烦（来自引用的答案）：

function escapeRegExp(str) {
    return str.replace(/([.*+?^=!:${}()|\[\]\/\\])/g, "\\$1");
}

function replaceAll(str, find, replace) {
    return str.replace(new RegExp(escapeRegExp(find), 'g'), replace);
}


// Use :
var newString = replaceAll(myString,"pattern", "replace_with_this");

在你的例子中：

for (var i = 0; i < sport.length; i++)
{
    newstring = replaceAll(
                    // original String
                    original,
                    // pattern
                    '<img width="20" src="img/icons/'+sport[i]+'.png"/>',
                    // replace with :
                    ':'+sport[i]+':');
}

注意： replaceAll您不必逃避您的模式，这是由escapeRegExp函数

完成的

替换和Concat图像HTML字符串

1 个答案:

编辑：