none
JavaScript Replace RRS feed

  • Question

  • How to replace texts in JavaScript in the whole document? I want to make a word filter in JavaScript that will replace any bad words on the page to an another word. The replace() function can only replace variables not the whole document!
    Saturday, May 24, 2008 9:53 PM

Answers

  • Maybe get document.all, then iterate through each member looking for innerText and replacing it with the results of a jscript replace?  Could take a long time to execute.  Hacky.
    Wednesday, May 28, 2008 12:05 AM
  • Given:-

     

    Some content

    Some more content

     

    Amoungst other things document.all will return the div and both spans.  When you've done the replace on the innerText of the div what do you then do with it?  If you assign it back as the innerText then you'll destroy the two spans it contains..

     

    Try this (watch out the reg expression is word wrapped):-

     

    Code Snippet

    function replaceTextInDocument(search, replacement)
    {

     var rgx = getRegExpForText(search, "g");

     walkTextNodes(document.body, fn)

     function fn(node)
     {
      node.nodeValue = node.nodeValue.replace(rgx, replacement)
     }
    }

    function getRegExpForText(search, modifiers)
    {
     search = search.replace(/(\(|\)|\\|\^|\$|\||\?|\:|\[|\]|\.|\{|\}|\+|\*|\=|\!)/g,'\\$1')
     return new RegExp(search, modifiers)
    }

    function walkTextNodes(node, fn)
    {
     if (node.nodeType == 3)
     {
      fn(node)
     }
     else
     {
      var oNodes = node.childNodes
      for (var i = 0, length = oNodes.length; i < length; i++)
       walkTextNodes(oNodes[i], fn)
     }
    }

     

     

    This is also not going to be fast but on top of maintain element structure it works across browsers also.  However if the content includes inputs and textareas then these will need special treatment.

     

    Thursday, May 29, 2008 9:38 AM

All replies

  •  

    Surely this is something you would want to do server side not in clientside javascript?
    Monday, May 26, 2008 8:26 AM
  • It's client side, it just replaces all words to other words in the full document.
    Tuesday, May 27, 2008 12:31 AM
  • Maybe get document.all, then iterate through each member looking for innerText and replacing it with the results of a jscript replace?  Could take a long time to execute.  Hacky.
    Wednesday, May 28, 2008 12:05 AM
  • So it's like
    Code Snippet

    document.all.innerText.replace(/string/,string2);



    Thursday, May 29, 2008 2:51 AM
  • Given:-

     

    Some content

    Some more content

     

    Amoungst other things document.all will return the div and both spans.  When you've done the replace on the innerText of the div what do you then do with it?  If you assign it back as the innerText then you'll destroy the two spans it contains..

     

    Try this (watch out the reg expression is word wrapped):-

     

    Code Snippet

    function replaceTextInDocument(search, replacement)
    {

     var rgx = getRegExpForText(search, "g");

     walkTextNodes(document.body, fn)

     function fn(node)
     {
      node.nodeValue = node.nodeValue.replace(rgx, replacement)
     }
    }

    function getRegExpForText(search, modifiers)
    {
     search = search.replace(/(\(|\)|\\|\^|\$|\||\?|\:|\[|\]|\.|\{|\}|\+|\*|\=|\!)/g,'\\$1')
     return new RegExp(search, modifiers)
    }

    function walkTextNodes(node, fn)
    {
     if (node.nodeType == 3)
     {
      fn(node)
     }
     else
     {
      var oNodes = node.childNodes
      for (var i = 0, length = oNodes.length; i < length; i++)
       walkTextNodes(oNodes[i], fn)
     }
    }

     

     

    This is also not going to be fast but on top of maintain element structure it works across browsers also.  However if the content includes inputs and textareas then these will need special treatment.

     

    Thursday, May 29, 2008 9:38 AM