Заменить текст на странице HTML с помощью jQuery

Как заменить любую строку в jQuery?

Скажем, у меня есть строка "-9o0-9909", и я хочу заменить ее на другую строку.

ОТВЕТЫ

Ответ 1

Вы можете использовать следующее, чтобы заменить первое вхождение слова в теле страницы:

var replaced = $("body").html().replace('-9o0-9909','The new string');
$("body").html(replaced);

Если вы хотите заменить все вхождения слова, вам нужно использовать регулярное выражение и объявить его глобальным /g:

var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string');
$("body").html(replaced);

Если вам нужен один лайнер:

$("body").html($("body").html().replace(/12345-6789/g,'<b>abcde-fghi</b>'));

В основном вы принимаете HTML-код в тегах <body> страницы в строковой переменной, используя replace(). найти и изменить первое вхождение найденной строки с новой строкой. Или, если вы хотите найти и заменить все вхождения строки, добавьте немного регулярного выражения в микс.

См. демонстрацию здесь - посмотрите на верхний левый верхний HTML, чтобы увидеть исходный текст, jQuery ниже, и вывод на внизу справа.

Ответ 2

Как и другие, упомянутые в этом потоке, замена всего тела HTML - плохая идея, потому что он повторно вставляет всю DOM и может потенциально нарушить любой другой javascript, который действует на эти элементы.

Вместо этого замените текст на своей странице, а не сами элементы DOM, используя фильтр jQuery:

  $('body :not(script)').contents().filter(function() {
    return this.nodeType === 3;
  }).replaceWith(function() {
      return this.nodeValue.replace('-9o0-9909','The new string');
  });

this.nodeType - это тип node, который мы ищем, чтобы заменить содержимое. nodeType 3 - это текст. Посмотрите полный список здесь.

Ответ 3

... У меня есть строка "-9o0-9909", и я хочу заменить ее на другую строку.

Код ниже сделает это.

var str = '-9o0-9909';

str = 'new string';

Шутки в сторону, замена текстовых узлов не является тривиальной с JavaScript.

Я написал сообщение об этом: Замена текста на JavaScript.

Ответ 4

Идея замены html хороша, но если сделать это с document.body, страница будет мигать, а реклама исчезнет.

Мое решение:
$("*:contains('purrfect')").each(function() { var replaced = $(this).html().replace(/purrfect/g, "purrfect"); $(this).html(replaced); });

Ответ 5

Откажитесь от статью Padolsey о поиске и замене DOM, а также библиотеки для реализации описанного алгоритма.

В этом примере использования я заменяю весь текст внутри <div id="content">, который выглядит как телефонный номер США с ссылкой схемы tel::

findAndReplaceDOMText(document.getElementById('content'), {
    find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g,
    replace:function (portion) {
        var a = document.createElement('a');
        a.className = 'telephone';
        a.href = 'tel:' + portion.text.replace(/\D/g, '');
        a.textContent = portion.text;
        return a;
    }
});

Ответ 7

var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string');
$("body").html(replaced);

для переменной:

var replaced = $("body").html().replace(new RegExp("-1o9-2202", "igm"),'The ALL new string');
$("body").html(replaced);