Форум

nule · #1 (**permalink**) 13.03.2013, 13:17

Здравствуйте!
Задача - заменить несколько разных слов на странице.
Для одного слова использовал

document.body.innerHTML = document.body.innerHTML.replace(/Слово1/g, 'Замена1');

Но теперь возникла необходимость заменить также Слово2 на Замена2 и Слово3 на Замена3. Не хотелось бы писать китайский код. Как можно поизящней решить задачу?
Спасибо!

tsigel · #2 (**permalink**) 13.03.2013, 13:28

var text
var a = ['слово1', 'слово2'...];
var b = ['замена1', 'замена2'...]; 
for (var i in a) {
text = text.replace(/a[i]/g, b[i]);
}

rgl · #3 (**permalink**) 13.03.2013, 13:54

Мой вариант может показаться сложнее, но думаю что на больших текстах он будет работать быстрее, т.к. по тексту будет проходить один раз:

var text
var a = ['слово1', 'слово2'...];
var b = ['замена1', 'замена2'...];
var allReplaces = {};
for( var i = 0; i < a.length; ++i )
  allReplaces[ a[i] ] = b[i];
text = text.replace( RegExp( a.join("|"), "g" ), function(x) { return allReplaces[x]; } );

nule · #4 (**permalink**) 13.03.2013, 13:56

tsigel, в этом случае заменяются буквы ai. Т.е. a[i] воспринимается как ai, а не как элемент массива

rgl · #5 (**permalink**) 13.03.2013, 14:00

tsigel,
в вашем примере пятая строка должна быть
text = text.replace( RegExp( a[i], "g" ), b[i]);

Deff · #6 (**permalink**) 13.03.2013, 14:13

Ксать все события, привязанные на элементы - теряем, если привязка не в самом теге

рони · #7 (**permalink**) 13.03.2013, 14:58

nule,
Вариант...

<!DOCTYPE HTML>
<html>
<head>
 <meta charset="utf-8" />
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript">
$.fn.replaceText = function (e, f, g) {
       return this.each(function () {
           var a = this.firstChild,
               c, b, d = [];
           if (a) {
               do 3 === a.nodeType && (c = a.nodeValue, b = c.replace(e, f), b !== c && (!g && /</.test(b) ? ($(a).before(b), d.push(a)) : a.nodeValue = b));
               while (a = a.nextSibling)
           }
           d.length && $(d).remove()
       })
   };
$(window).load(function () {
$('a').click(function(e){ alert('test') });
var a = ['слово1', 'слово2'];
var b = ['замена1', 'замена2'];
for( var i = 0; i < a.length; i++ )
$("body *").replaceText(new RegExp( a[i], "g" ), b[i]);
    });
  </script>
<title></title>
</head>
<body>
<p><a href="#">слово1 test слово1</a></p>
<b><a href="#">слово2</a></b>
<p><a href="#">слово1</a></p>
<i><b><a href="#">слово2</a></b></i>
</body>
</html>

nule · #8 (**permalink**) 13.03.2013, 15:28

Всем спасибо! Использовал вариант tsigel с исправлением от rgl. Думаю, для моего случая вполне достаточно. Задача была поправить несколько криво переведенных слов в админке сайта. Так что ограничился самым простым вариантом.

q21 · #9 (**permalink**) 14.06.2014, 14:47

IMHO, когда замены всего 3, изящнее всего написать три раза и не наворачивать массивы и циклы, с тем же результатом.
Если речь об админке своего сайта - поменять слова собственно в файле локализации или в файле языкового оверрайда, если CMS это поддерживает. Ищи "language override".
Яваскрипт для этого использовать - как раз и есть китайский вариант.

Если же речь о систематической замене слов на чужих страницах в своём браузере - можно использовать аддон типа FoxReplace.
https://addons.mozilla.org/ru/firefox/addon/foxreplace

_Eldar_ · #10 (**permalink**) 11.03.2015, 15:35

рони , а если аяксом перегружается блок с текстом, то слова в тексте можно ли как-нибудь изменить?
Прочитал - Скрипт на JS не работает без перезагрузки страницы что вроде при аяксе подгружать функцию - которая будет удалять действие прошлых функций(по замене слов) на новую функцию, подскажите что и как делать

$.fn.replaceText = function (e, f, g)... как удалить функцию?

Форум

Справочник

Discord чат

Курсы javascript