Заменить все текстовые вхождения в DOM с помощью jQuery

Question

Я пытаюсь написать расширение chrome для замены всех конкретных вхождений текста на веб-странице с помощью специального текста.

Я нашел похожие вопросы в SO и попробовал следующее решение, но он, похоже, не работает.

config.text_config = [ 
     { 
      src: "Lorem ipsum", 
      target: "live long and prosper" 
     } 
    ] 
    config.text_config.forEach(function (obj) { 

     $('*').each(function() { 
      var text = $(this).text().replace(obj.src, 'REPLACEMENT_TEXT'); 
      $(this).text(text); 
     }) 

    }); 

Может ли кто-нибудь мне помочь?

Answer 1

Вы можете сделать что-то вроде того, чтобы быть уверенным, чтобы заменить текст для всех узлов:

$(function() { 
 
    $.fn.getTextNodes = function(contentText) { 
 
    return $(this).find(":not(iframe)").addBack().contents().filter(function() { 
 
     return this.nodeType == 3 && this.nodeValue.indexOf(contentText) != -1; 
 
    }); 
 
    }; 
 
    var config = {} 
 
    config.text_config = [ 
 
    { 
 
     src: "Lorem ipsum", 
 
     target: "live long and prosper" 
 
    } 
 
    ]; 
 
    config.text_config.forEach(function (obj) { 
 
    var re = new RegExp(obj.src, 'g'); 
 
    $('*').getTextNodes(obj.src).each(function(item, element) { 
 
     this.nodeValue = this.nodeValue.replace(re, 'REPLACEMENT_TEXT'); 
 
    }); 
 
    }); 
 
});

<script src="//code.jquery.com/jquery-1.11.3.js"></script> 
 

 

 
<div id="Message area"> 
 
    <div class="selected-div"> 
 
     Operation Lorem ipsum Lorem ipsum 1 
 
    </div> 
 
    <div class="selected-div"> 
 
     Operation Lorem ipsum Lorem ipsum 2 
 
    </div> 
 
    <div class="selected-div"> 
 
     Operation Lorem ipsum Lorem ipsum 3 
 
    </div> 
 
    <div class="selected-div"> 
 
     Operation Lorem ipsum Lorem ipsum4 
 
    </div> 
 
</div>