常见错误

Question

在JavaScript中有一个简单的等价吗？

$find = array("<", ">", "\n");
$replace = array("&lt;", "&gt;", "<br/>");

$textarea = str_replace($find, $replace, $textarea);

这是使用PHP的str_replace，它允许您使用一组单词来查找和替换。我可以使用JavaScript / jQuery做这样的事情吗？

...
var textarea = $(this).val();

// string replace here

$("#output").html(textarea);
...

Answer 1

您可以使用自己的函数扩展String对象，该函数可以满足您的需要（如果缺少功能，则非常有用）：

String.prototype.replaceArray = function(find, replace) {
  var replaceString = this;
  for (var i = 0; i < find.length; i++) {
    replaceString = replaceString.replace(find[i], replace[i]);
  }
  return replaceString;
};

对于全局替换，您可以使用正则表达式：

String.prototype.replaceArray = function(find, replace) {
  var replaceString = this;
  var regex; 
  for (var i = 0; i < find.length; i++) {
    regex = new RegExp(find[i], "g");
    replaceString = replaceString.replace(regex, replace[i]);
  }
  return replaceString;
};

要使用该功能，它将与您的PHP示例类似：

var textarea = $(this).val();
var find = ["<", ">", "\n"];
var replace = ["&lt;", "&gt;", "<br/>"];
textarea = textarea.replaceArray(find, replace);

Answer 2

常见错误

此页面上的几乎所有答案都使用累积替换，因此在替换字符串本身可以替换时会遇到相同的缺陷。以下是这种模式失败的几个例子（h / t @KurokiKaze @derekdreery）：

＆＃13;

function replaceCumulative(str, find, replace) {
  for (var i = 0; i < find.length; i++)
    str = str.replace(new RegExp(find[i],"g"), replace[i]);
  return str;
};

// Fails in some cases:
console.log( replaceCumulative( "tar pit", ['tar','pit'], ['capitol','house'] ) );
console.log( replaceCumulative( "you & me", ['you','me'], ['me','you'] ) );

＆＃13;

解决方案

＆＃13;

function replaceBulk( str, findArray, replaceArray ){
  var i, regex = [], map = {}; 
  for( i=0; i<findArray.length; i++ ){ 
    regex.push( findArray[i].replace(/([-[\]{}()*+?.\\^$|#,])/g,'\\$1') );
    map[findArray[i]] = replaceArray[i]; 
  }
  regex = regex.join('|');
  str = str.replace( new RegExp( regex, 'g' ), function(matched){
    return map[matched];
  });
  return str;
}

// Test:
console.log( replaceBulk( "tar pit", ['tar','pit'], ['capitol','house'] ) );
console.log( replaceBulk( "you & me", ['you','me'], ['me','you'] ) );

＆＃13;

注意：

这是@ elchininet solution的更兼容的变体，它使用map()和Array.indexOf()因此无法在IE8及更早版本中工作。

@ elchininet的实现对PHP的str_replace()更为真实，因为它还允许字符串作为查找/替换参数，并且如果存在重复项将使用第一个查找数组匹配（我的版本）将使用最后一个）。我在这个实现中没有接受字符串，因为这个案例已经由JS的内置String.replace()处理。

Answer 3

text = text.replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\n/g, '<br/>');

Answer 4

更直观的方法：

String.prototype.htmlProtect = function() {
  var replace_map;

  replace_map = {
    '\n': '<br />',
    '<': '&lt;',
    '>': '&gt;'
  };

  return this.replace(/[<>\n]/g, function(match) { // be sure to add every char in the pattern
    return replace_map[match];
  });
};

这就是你怎么称呼它：

var myString = "<b>tell me a story, \n<i>bro'</i>";
var myNewString = myString.htmlProtect();

// &lt;b&gt;tell me a story, <br />&lt;i&gt;bro'&lt;/i&gt;

Answer 5

您可以将String对象的replace方法与第二个参数中的函数一起使用：

第一种方法（使用查找和替换对象）

var findreplace = {"<" : "&lt;", ">" : "&gt;", "\n" : "<br/>"};

textarea = textarea.replace(new RegExp("(" + Object.keys(findreplace).map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|") + ")", "g"), function(s){ return findreplace[s]});

jsfiddle

第二种方法（使用两个数组，查找和替换）

var find = ["<", ">", "\n"];
var replace = ["&lt;", "&gt;", "<br/>"];

textarea = textarea.replace(new RegExp("(" + find.map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|") + ")", "g"), function(s){ return replace[find.indexOf(s)]});

jsfiddle

期望的功能：

function str_replace($f, $r, $s){
   return $s.replace(new RegExp("(" + $f.map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|") + ")", "g"), function(s){ return $r[$f.indexOf(s)]});
}

$textarea = str_replace($find, $replace, $textarea);

修改

此function允许String或Array作为参数：

function str_replace($f, $r, $s){ return $s.replace(new RegExp("(" + (typeof($f) == "string" ? $f.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&") : $f.map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|")) + ")", "g"), typeof($r) == "string" ? $r : typeof($f) == "string" ? $r[0] : function(i){ return $r[$f.indexOf(i)]}); }

Answer 6

您可能想要查看名为phpJS的JS库。

它允许您使用str_replace函数，就像在PHP中使用它一样。还有更多的PHP函数“移植”到JavaScript。

http://phpjs.org/functions/str_replace:527

Answer 7

String.prototype.replaceArray = function (find, replace) {
    var replaceString = this;
    for (var i = 0; i < find.length; i++) {
        // global replacement
        var pos = replaceString.indexOf(find[i]);
        while (pos > -1) {
            replaceString = replaceString.replace(find[i], replace[i]);
            pos = replaceString.indexOf(find[i]);
        }
    }
    return replaceString;
};

var textT = "Hello world,,,,, hello people.....";
var find = [".",","];
var replace = ['2', '5'];
textT = textT.replaceArray(find, replace);
// result: Hello world55555 hello people22222

Answer 8

在一次方法调用中无法执行此操作，您必须将调用链接在一起，或者编写一个手动执行所需操作的函数。

var s = "<>\n";
s = s.replace("<", "&lt;");
s = s.replace(">", "&gt;");
s = s.replace("\n", "<br/>");

Answer 9

对于代码，您应该只能使用.text()代替.html()设置内容。

示例： http://jsfiddle.net/Phf4u/1/

var textarea = $('textarea').val().replace(/<br\s?\/?>/, '\n');

$("#output").text(textarea);

...或者如果您只想删除<br>元素，则可以删除.replace()，并暂时将它们作为DOM元素。

示例： http://jsfiddle.net/Phf4u/2/

var textarea = $('textarea').val();

textarea = $('<div>').html(textarea).find('br').remove().end().html();

$("#output").text(textarea);

Answer 10

一个简单的var number = '1,000.23'; number = number.split(',').join(''); console.log(number);循环可以很好地解决此问题：

forEach

Answer 11

最高答案等同于：

let text = find.reduce((acc, item, i) => {
  const regex = new RegExp(item, "g");
  return acc.replace(regex, replace[i]);
}, textarea);

为此：

var textarea = $(this).val();
var find = ["<", ">", "\n"];
var replace = ["&lt;", "&gt;", "<br/>"];

在这种情况下，没有必要进行强制编程。

Answer 12

使用ES6： 有多种方法search用于字符串，replace中的JavaScript。其中之一如下

const findFor = ['<', '>', '\n'];

const replaceWith = ['&lt;', '&gt;', '<br/>'];

const originalString = '<strong>Hello World</strong> \n Let\'s code';

let modifiedString = originalString;

findFor.forEach( (tag, i) => modifiedString = modifiedString.replace(new RegExp(tag, "g"), replaceWith[i]) )

console.log('Original String: ', originalString);
console.log('Modified String: ', modifiedString);

Answer 13

一种方法是：

var text = $(this).val();
text = text.replace(/</g, "&lt;").replace(/>/g, "&gt;");
$("#output").html(text);

Answer 14

我有一个案例，我必须从字符串中删除字符，并按照这样做：

Dispose

如果字符串本身就是javascript中的字符数组，那么本来是非常简洁的，这样我们就不需要那些分割/连接，比如let badChars = ['å', 'ä', 'ö']; let newName = fileName.split("").filter((chr) => badChars.indexOf(chr) === -1).join("");，但我仍然觉得如果你只需要交易，它就是整洁可读的字符而不是字符串。

一次更换多个字符串

14 个答案:

常见错误

解决方案