Finding and replacing text on a page

Discussion in 'Javascript' started by Andrew Poulos, Apr 15, 2005.

  1. Say I have a page, which has been created by a third party, and the page
    may contain some pre-specified text. How can I find and replace that
    text dynamically? For example, if the page I have contains this HTML:

    <div id=”oDiv” style="margin-bottom:10px;">{when}</div>

    <div>
    <table style="border:1px solid gray">
    <tr>
    <td>blah</td>
    <td><img src="img.gif" title="image"></td>
    </tr>
    <tr>
    <td style="background-color:#F3F3F3;">Visit us
    <strong>{when}</strong>.</td>
    </tr>
    <table>
    </div>

    how can I replace all occurances of {when} with, say, NOW without
    "upsetting" any of the existing tags?

    Andrew Poulos
    Andrew Poulos, Apr 15, 2005
    #1
    1. Advertising

  2. Andrew Poulos wrote:

    > Say I have a page, which has been created by a third party, and the page
    > may contain some pre-specified text. How can I find and replace that
    > text dynamically? For example, if the page I have contains this HTML:
    >
    > <div id=”oDiv” style="margin-bottom:10px;">{when}</div>
    >
    > <div>
    > <table style="border:1px solid gray">
    > <tr>
    > <td>blah</td>
    > <td><img src="img.gif" title="image"></td>
    > </tr>
    > <tr>
    > <td style="background-color:#F3F3F3;">Visit us
    > <strong>{when}</strong>.</td>
    > </tr>
    > <table>
    > </div>
    >
    > how can I replace all occurances of {when} with, say, NOW without
    > "upsetting" any of the existing tags?


    IE/Win with its TextRange implementation allows that easily
    <http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/obj_textrange.asp>
    at least as long as the string to be replaced is inside the same element.

    Here is an example:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Text range manipulation with IE/Win</title>
    <script type="text/javascript">
    function replaceStringInElement (containerElement, stringToBeReplaced,
    replacementString) {
    var range;
    var replaceCounter = 0;
    if (document.body && document.body.createTextRange &&
    (range = document.body.createTextRange()))
    {
    range.moveToElementText(containerElement);
    while (range.findText(stringToBeReplaced)) {
    range.text = replacementString;
    replaceCounter++;
    }
    }
    return replaceCounter;
    }

    window.onload = function (evt) {
    var divToSearch;
    if (document.getElementById && (divToSearch =
    document.getElementById('exampleDiv1'))) {
    var replaceCount = replaceStringInElement(divToSearch, '{when}',
    'now');
    alert('Replaced ' + replaceCount + ' string(s).');
    alert(divToSearch.outerHTML);
    }
    };
    </script>
    </head>
    <body>

    <h1>Text range manipulation with IE/Win</h1>

    <div id="exampleDiv1">

    <div id="oDiv" style="margin-bottom:10px;">{when}</div>

    <div>
    <table style="border:1px solid gray">
    <tr>
    <td>blah</td>
    <td><img src="img.gif" title="image" alt="image"></td>
    </tr>
    <tr>
    <td style="background-color:#F3F3F3;">Visit us
    <strong>{when}</strong>.</td>
    </tr>
    </table>
    </div>

    <p>Too difficult? <b>{</b><span>w</span>hen}</p>

    </div>

    </body>

    </html>

    Three replacements are made where for the first two the markup is
    preserved while <b>{</b><span>w</span>hen} then ends up as <b>now</b> I
    think as. You would need to add logic to prevent that replacement or you
    would need to add logic and make use of pasteHTML to replace the HTML
    markup in that case.


    --

    Martin Honnen
    http://JavaScript.FAQTs.com/
    Martin Honnen, Apr 15, 2005
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Ben Holness
    Replies:
    0
    Views:
    5,422
    Ben Holness
    Jan 6, 2006
  2. Brown Smith
    Replies:
    1
    Views:
    491
    Frankie
    Jun 25, 2005
  3. DarthBob88

    Finding and Replacing Substrings In A String

    DarthBob88, Sep 23, 2007, in forum: C Programming
    Replies:
    7
    Views:
    553
    Keith Thompson
    Sep 23, 2007
  4. Rob Meade

    Replacing - and not Replacing...

    Rob Meade, Apr 5, 2005, in forum: ASP General
    Replies:
    5
    Views:
    259
    Chris Hohmann
    Apr 11, 2005
  5. Andrew Poulos

    Finding and replacing a line

    Andrew Poulos, Jun 4, 2006, in forum: Javascript
    Replies:
    2
    Views:
    98
Loading...

Share This Page