Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   document.body.innerHTML.replace. Замена нескольких слов (https://javascript.ru/forum/misc/36365-document-body-innerhtml-replace-zamena-neskolkikh-slov.html)

nule 13.03.2013 13:17

document.body.innerHTML.replace. Замена нескольких слов
 
Здравствуйте!
Задача - заменить несколько разных слов на странице.
Для одного слова использовал
document.body.innerHTML = document.body.innerHTML.replace(/Слово1/g, 'Замена1');

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

tsigel 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 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 13.03.2013 13:56

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

rgl 13.03.2013 14:00

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

Deff 13.03.2013 14:13

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

рони 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 13.03.2013 15:28

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

q21 14.06.2014 14:47

IMHO, когда замены всего 3, изящнее всего написать три раза и не наворачивать массивы и циклы, с тем же результатом.
Если речь об админке своего сайта - поменять слова собственно в файле локализации или в файле языкового оверрайда, если CMS это поддерживает. Ищи "language override".
Яваскрипт для этого использовать - как раз и есть китайский вариант. :lol:
Если же речь о систематической замене слов на чужих страницах в своём браузере - можно использовать аддон типа FoxReplace.
https://addons.mozilla.org/ru/firefox/addon/foxreplace
:yes:

_Eldar_ 11.03.2015 15:35

рони , а если аяксом перегружается блок с текстом, то слова в тексте можно ли как-нибудь изменить?
Прочитал - http://javascript.ru/forum/136619-post6.html что вроде при аяксе подгружать функцию - которая будет удалять действие прошлых функций(по замене слов) на новую функцию, подскажите что и как делать :)

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

рони 11.03.2015 16:14

_Eldar_,
а что мешает обработать текст после вставки


Часовой пояс GMT +3, время: 23:56.