여러 문자열을 한 번에 바꾸기
자바스크립트에 이와 동등한 쉬운 것이 있습니까?
$find = array("<", ">", "\n");
$replace = array("<", ">", "<br/>");
$textarea = str_replace($find, $replace, $textarea);
이것은 PHP의 것을 사용하고 있습니다.str_replace
, 단어 배열을 사용하여 찾고 교체할 수 있습니다.자바스크립트 / jQuery를 이용해서 이런 작업을 할 수 있습니까?
...
var textarea = $(this).val();
// string replace here
$("#output").html(textarea);
...
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;
};
전역 교체의 경우 regex를 사용할 수 있습니다.
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 = ["<", ">", "<br/>"];
textarea = textarea.replaceArray(find, replace);
흔한 실수
이 페이지의 거의 모든 답변은 누적 교체를 사용하므로 교체 문자열 자체가 교체 대상인 경우와 동일한 결함이 발생합니다.다음은 이 패턴이 실패하는 몇 가지 예입니다(h/t @KurokiKaze @derekdreery).
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'] ) );
해결책
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'] ) );
참고:
이것은 다음을 사용하는 @elchininet의 솔루션의 더 호환되는 변형입니다.map()
그리고.Array.indexOf()
IE8 이상에서는 작동하지 않습니다.
@elchininet의 구현은 PHP의 구현에 충실합니다.str_replace()
, 문자열을 찾기/바꾸기 매개변수로 사용할 수 있으며 중복되는 경우 첫 번째 찾기 배열 일치를 사용하기 때문입니다(내 버전은 마지막을 사용합니다).이 구현에서 문자열을 받지 않았습니다. 왜냐하면 그 케이스는 이미 JS의 내장형으로 처리되고 있기 때문입니다.String.replace()
.
text = text.replace(/</g, '<').replace(/>/g, '>').replace(/\n/g, '<br/>');
시각적 접근 방식:
String.prototype.htmlProtect = function() {
var replace_map;
replace_map = {
'\n': '<br />',
'<': '<',
'>': '>'
};
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();
// <b>tell me a story, <br /><i>bro'</i>
당신은 의 교체 방법을 사용할 수 있습니다.String
이전에 대체된 문자열을 대체하지 않도록 두 번째 매개 변수에 함수가 있는 object:
첫 번째 방법(개체 찾기 및 바꾸기 사용)
var findreplace = {"<" : "<", ">" : ">", "\n" : "<br/>"};
textarea = textarea.replace(new RegExp("(" + Object.keys(findreplace).map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|") + ")", "g"), function(s){ return findreplace[s]});
두 번째 방법(2개의 배열을 사용하여 찾고 바꿉니다)
var find = ["<", ">", "\n"];
var replace = ["<", ">", "<br/>"];
textarea = textarea.replace(new RegExp("(" + find.map(function(i){return i.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&")}).join("|") + ")", "g"), function(s){ return replace[find.indexOf(s)]});
원하는 기능:
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)]});
}
단순한forEach
루프는 이를 꽤 잘 해결합니다.
let text = 'the red apple and the green ball';
const toStrip = ['red', 'green'];
toStrip.forEach(x => {
text = text.replace(x, '');
});
console.log(text);
// logs -> the apple and the ball
가장 중요한 답은 다음과 같습니다.
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 = ["<", ">", "<br/>"];
이 경우 명령형 프로그래밍이 수행되지 않습니다.
ES6 사용: 다음과 같은 여러 가지 방법이 있습니다.search
끈용으로 그리고replace
인에JavaScript
. 그 중 하나는 다음과 같습니다.
const findFor = ['<', '>', '\n'];
const replaceWith = ['<', '>', '<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);
phpJS라고 불리는 JS 라이브러리를 조사해 보는 것이 좋습니다.
str_replace 기능을 PHP에서 사용하는 방법과 유사하게 사용할 수 있습니다.또한 자바스크립트로 "포트된" 더 많은 php 함수들이 있습니다.
http://phpjs.org/functions/str_replace:527
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
const items = {
'<': '<',
'>': '>',
'\n': '<br/>',
}
const re = new RegExp('[' + Object.keys(items).join('') + ']', 'g')
const input = '<foo>\n<bar>'
const output = input.replaceAll(re, key => items[key])
console.log(output)
한 번의 메서드 호출에서 이 작업을 수행할 방법은 없습니다. 호출을 서로 연결하거나 필요한 작업을 수동으로 수행하는 함수를 작성해야 합니다.
var s = "<>\n";
s = s.replace("<", "<");
s = s.replace(">", ">");
s = s.replace("\n", "<br/>");
태그의 경우 다음과 같은 내용을 설정할 수 있어야 합니다..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);
개체를 매개 변수로 하는 버전:
String.prototype.strtr = function (replace) {
keys = Object.keys(replace);
result = this;
for (i = 0; i < keys.length; i++) {
result = result.replace(keys[i], replace[keys[i]]);
}
return result;
}
function htmlspecialchars(str) {
return String(str).strtr({">": ">", "<": "<", "\n": "<br/>"});
}
// usage
text = "<span>spam</span>";
htmlspecialchars(text);
jquery는 그것에 대한 해결책을 가지고 있습니다.
var htmlString = $(요소). html(); $(요소).text(htmlString );
여기서 보기: https://api.jquery.com/html/
이 모든 것을 함수로 감싸면 배열과 문자열을 모두 전달할 수 있습니다.
function str_replace(search,replace,subject) {
if(!Array.isArray(search)){
subject = subject.replace(new RegExp(search, "g"), replace)
}
else{
search.forEach( (tag, i) => subject = subject.replace(new RegExp(tag, "g"), replace[i]) )
}
return subject;
}
바로 그거!
let v = "Test's <<foo>> ((baAr))";
console.log(v);
const r = ['<', '>', 'a', '\\)', '\\(', '\'' ];
for (var i = r.length - 1; i >= 0; i--) {
v = v.replace((new RegExp(r[i], "gi")), "_");
}
console.log(v);
한 가지 방법은 다음과 같습니다.
var text = $(this).val();
text = text.replace(/</g, "<").replace(/>/g, ">");
$("#output").html(text);
언급URL : https://stackoverflow.com/questions/5069464/replace-multiple-strings-at-once
'programing' 카테고리의 다른 글
C++에 오버로드 기능이 추가된 이유는 무엇입니까? (0) | 2023.10.20 |
---|---|
이 문자열 반전 C 코드가 세그먼트 오류를 일으키는 이유는 무엇입니까? (0) | 2023.10.20 |
SQL 쿼리를 통해 모든 제품, 카테고리 및 메타데이터 우커머스/워드프레스를 얻을 수 있습니다. (0) | 2023.10.20 |
GCC의 __thread는 어떻게 구현됩니까? (0) | 2023.10.20 |
반복하는 동안 Python dict 수정 (0) | 2023.10.20 |