JS Search & Replace...

  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

Okies, a quicky for you guys... I'm looking to do a search & replace on one of my sites so I can implement some kind of glossary system.

Here's the basic code I've got so far for a quick test page...

Code: [ Select ]
<html>
<head>
<script language="javascript">
 function replace_stuff() {
  document.body.innerHTML = document.body.innerHTML.replace(/test/g,'sample');
 }
</script>

</head>
 <body onLoad="javascript:replace_stuff();">
   Line 1 : test<br />
   Line 2 : <a href="http://www.test.com/">http://www.test.com/</a>
 </body>
</html>
  1. <html>
  2. <head>
  3. <script language="javascript">
  4.  function replace_stuff() {
  5.   document.body.innerHTML = document.body.innerHTML.replace(/test/g,'sample');
  6.  }
  7. </script>
  8. </head>
  9.  <body onLoad="javascript:replace_stuff();">
  10.    Line 1 : test<br />
  11.    Line 2 : <a href="http://www.test.com/">http://www.test.com/</a>
  12.  </body>
  13. </html>


But, there's a problem with this.

Line 1 works perfectly. It replaces "test" with "sample", and all is well with the world.

The problem is with Line 2. If the text is inside a link, either as the actual URL or as part of the anchor text, I want it to completely skip over it and not replace it. Line 2 should remain untouched.

Anybody got any ideas on how to do this one?
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • SpooF
  • ٩๏̯͡๏۶
  • Bronze Member
  • User avatar
  • Posts: 3422
  • Loc: Richland, WA

Post 3+ Months Ago

is there a way to say replace everything but something in a sertain tag?
then you can run a if statment that says if NOT, then run your replace?
  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

lol, isn't that basically what I asked?
  • SpooF
  • ٩๏̯͡๏۶
  • Bronze Member
  • User avatar
  • Posts: 3422
  • Loc: Richland, WA

Post 3+ Months Ago

well i mean something that can pick through your code, and take all your links out and store everything else in side its a varilbe then go though that varible and replace things.
  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

You mean storing it in chunks in an array?

Doable, but there's got to be a more elegant solution using regexp.

Btw, the query has changed slightly...

Code: [ Select ]
  document.body.innerHTML = document.body.innerHTML.replace(/\b(test)\b/g, 'sample');


So, now something like "testicles" (sorry, couldn't think of another word), doesn't get turned into sampleicles, however because of the .'s in http://www.test.com, that still gets changed to http://www.sample.com.
  • SpooF
  • ٩๏̯͡๏۶
  • Bronze Member
  • User avatar
  • Posts: 3422
  • Loc: Richland, WA

Post 3+ Months Ago

well ive been looking for a better way to do this but this is all i can find

Code: [ Select ]
<html>
<head>
<script language="javascript">
 function replace_stuff() {
  document.body.innerHTML = document.body.innerHTML.replace(/\b(test)\b/g, 'sample');
    document.body.innerHTML = document.body.innerHTML.replace(/\b(.sample.)\b/g, '.test.');
    
 }
</script>

</head>
 <body onLoad="javascript:replace_stuff();">
   Line 1 : test</b> <br />
   Line 2 : <a href="http://www.test.com/">http://www.test.com/</a><br />
   Line 3 : tests<br />
 </body>
</html>
  1. <html>
  2. <head>
  3. <script language="javascript">
  4.  function replace_stuff() {
  5.   document.body.innerHTML = document.body.innerHTML.replace(/\b(test)\b/g, 'sample');
  6.     document.body.innerHTML = document.body.innerHTML.replace(/\b(.sample.)\b/g, '.test.');
  7.     
  8.  }
  9. </script>
  10. </head>
  11.  <body onLoad="javascript:replace_stuff();">
  12.    Line 1 : test</b> <br />
  13.    Line 2 : <a href="http://www.test.com/">http://www.test.com/</a><br />
  14.    Line 3 : tests<br />
  15.  </body>
  16. </html>


basicl just replace the test back in your links ^^
  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

The problem is, when I end up with 500 words in that glossary, having an extra 500 lines to change things BACK that it caught the wrong way the first time is not going to be that efficient :)
  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

*bump*

anybody? :)
  • katana
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2391
  • Loc: Edinburgh, Scotland

Post 3+ Months Ago

I wrote a script that converts British words in an HTML page into their American equivalents, on the fly. It ignores anything between tags. You can maybe hack it to suit what you need:

Code: [ Select ]
// American_English.js
// Written by Darren M. King, 2004

// CONSTANTS
var ENGLISH_TO_AMERICAN = 0;
var AMERICAN_TO_ENGLISH = 1;

var english = new Array();
var american = new Array();

// START OF DICTIONARY
english[0] = "colour";
american[0] = "color";
english[1] = "centre";
american[1] = "center";
english[2] = "capitalise";
american[2] = "capitalize";
english[3] = "americanised";
american[3] = "americanized";
// END OF DICTIONARY


function doReplace() {
    var lan;
    if(navigator.systemLanguage) {
        lan = navigator.systemLanguage.toLowerCase();
    }
    else {
        if(navigator.language)
            lan = navigator.language.toLowerCase();
        else
            lan = navigator.userLanguage.toLowerCase();
    }
    if(lan == "en-us")
        replaceWords(ENGLISH_TO_AMERICAN);
}    
    
function replaceWords(changeType) {
    var bodyText = document.body.innerHTML;
    var i;
    var fromArr;
    var toArr;
    if(changeType == ENGLISH_TO_AMERICAN) {
        fromArr = english;
        toArr = american;
    }
    else {
        fromArr = american;
        toArr = english;
    }
    for(i=0; i<fromArr.length; i++) {
        bodyText = replaceString(bodyText, fromArr[i], toArr[i]);
    }
    document.body.innerHTML = bodyText;
    //alert(bodyText);
}

function replaceString(haystack, needle, replacement) {
    var newText = "";
    var i= -1;
    var temp_needle = needle.toLowerCase();
    while(haystack.length > 0) {
        var temp_haystack = haystack.toLowerCase();
        i = temp_haystack.indexOf(temp_needle);
        //if not found, add whole string
        if(i == -1) {
            newText += haystack;
            haystack = "";
            break;
        }
        // if i is between first < and first >
        if(haystack.indexOf(">", i) < haystack.indexOf("<", i)) {
            newText += haystack.substr(0, haystack.indexOf(">")+1);
            haystack = haystack.substr(haystack.indexOf(">")+1);
        }
        else {
            // make a temporary copy of replacement word
            repWord = haystack.substr(i, needle.length);
            // Assume replacement always start with same character as needle
            temp_rep = repWord.charAt(0)+replacement.substr(1);
            // ensure the case of the replacement matches the case of the original
            newText += haystack.substr(0, i) + temp_rep;
            haystack = haystack.substr(i+needle.length);
        }
    }
    return newText;
}
  1. // American_English.js
  2. // Written by Darren M. King, 2004
  3. // CONSTANTS
  4. var ENGLISH_TO_AMERICAN = 0;
  5. var AMERICAN_TO_ENGLISH = 1;
  6. var english = new Array();
  7. var american = new Array();
  8. // START OF DICTIONARY
  9. english[0] = "colour";
  10. american[0] = "color";
  11. english[1] = "centre";
  12. american[1] = "center";
  13. english[2] = "capitalise";
  14. american[2] = "capitalize";
  15. english[3] = "americanised";
  16. american[3] = "americanized";
  17. // END OF DICTIONARY
  18. function doReplace() {
  19.     var lan;
  20.     if(navigator.systemLanguage) {
  21.         lan = navigator.systemLanguage.toLowerCase();
  22.     }
  23.     else {
  24.         if(navigator.language)
  25.             lan = navigator.language.toLowerCase();
  26.         else
  27.             lan = navigator.userLanguage.toLowerCase();
  28.     }
  29.     if(lan == "en-us")
  30.         replaceWords(ENGLISH_TO_AMERICAN);
  31. }    
  32.     
  33. function replaceWords(changeType) {
  34.     var bodyText = document.body.innerHTML;
  35.     var i;
  36.     var fromArr;
  37.     var toArr;
  38.     if(changeType == ENGLISH_TO_AMERICAN) {
  39.         fromArr = english;
  40.         toArr = american;
  41.     }
  42.     else {
  43.         fromArr = american;
  44.         toArr = english;
  45.     }
  46.     for(i=0; i<fromArr.length; i++) {
  47.         bodyText = replaceString(bodyText, fromArr[i], toArr[i]);
  48.     }
  49.     document.body.innerHTML = bodyText;
  50.     //alert(bodyText);
  51. }
  52. function replaceString(haystack, needle, replacement) {
  53.     var newText = "";
  54.     var i= -1;
  55.     var temp_needle = needle.toLowerCase();
  56.     while(haystack.length > 0) {
  57.         var temp_haystack = haystack.toLowerCase();
  58.         i = temp_haystack.indexOf(temp_needle);
  59.         //if not found, add whole string
  60.         if(i == -1) {
  61.             newText += haystack;
  62.             haystack = "";
  63.             break;
  64.         }
  65.         // if i is between first < and first >
  66.         if(haystack.indexOf(">", i) < haystack.indexOf("<", i)) {
  67.             newText += haystack.substr(0, haystack.indexOf(">")+1);
  68.             haystack = haystack.substr(haystack.indexOf(">")+1);
  69.         }
  70.         else {
  71.             // make a temporary copy of replacement word
  72.             repWord = haystack.substr(i, needle.length);
  73.             // Assume replacement always start with same character as needle
  74.             temp_rep = repWord.charAt(0)+replacement.substr(1);
  75.             // ensure the case of the replacement matches the case of the original
  76.             newText += haystack.substr(0, i) + temp_rep;
  77.             haystack = haystack.substr(i+needle.length);
  78.         }
  79.     }
  80.     return newText;
  81. }
  • Axe
  • Genius
  • Genius
  • User avatar
  • Posts: 5739
  • Loc: Sub-level 28

Post 3+ Months Ago

Hey, that's real nice of you, thanks Katana :)
  • katana
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2391
  • Loc: Edinburgh, Scotland

Post 3+ Months Ago

No prob :D

Post Information

  • Total Posts in this topic: 11 posts
  • Users browsing this forum: No registered users and 101 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.