Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder Jesper Møller's Avatar
    Join Date
    Jun 2006
    Location
    Denmark, Copenhagen
    Posts
    138
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Find and change text in a HTML page

    Im woud like to make a script that can find text in a HTML document and change it

    The text i shal finde will be text that are inside 2 asterix (**text to find**)

    when it find text inside ** it shal du one of to things..
    If the ** string is NOT inside a <h4></h4> tag .. it shal remove it (incl the **)
    If the ** string IS inside a <h4></h4> it shal change it to an image tag.

    Eksample
    <h4><a href="some url">**url/pic.gif 20 25 icon** My link</a></h4>
    shud be change to
    <h4><a href="some url"><img src="url/pic.gif" width="20" height="25" alt="icon" /> My link</a></h4>

    <p>**url/pic.gif 20 25 icon** My link</p>
    shud be change to
    <p> My link</p>

    hope someone can help mee
    "True knowledge exists in knowing that you know nothing."

    "Education is learning what you didn't even know you didn't know!"

  2. #2
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It's pretty brute force with no error checking but hopefully it will get you started.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html>
      <head>
        <title>Junque</title>
        <script type="text/javascript">
        /* <![CDATA[ */
          function replaceAst(s, bDoImg) {
            var str = "";
    
            for (var i = 0; i < s.length - 1; i++) {
              if (s.charAt(i) == '*' && s.charAt(i + 1) == '*') {
                if (bDoImg) {
                  while (s.charAt(i) == '*') i++;
                  var index = s.indexOf("**", i);
                  var subS = s.substr(i, index - i);
                  i += index - i + 1;
                  var a = subS.split(" ");
                  str = str.concat('<img src="' + a[0] + '" width="' + a[1] + '" height="' + a[2] + '" alt="' + a[3] + '" />');
                } else {
                  for (i++ ; i < s.length - 1; i++) {
                    if (s.charAt(i) == '*' && s.charAt(i + 1) == '*') {
                      i++;
                      break;
                    }
                  }
                }
              } else {
                str = str.concat(s.charAt(i));
              }
            }
    
            return(str);
          }
    
          function doIt() {
            var eles = document.getElementsByTagName("h4");
            for (var i = 0; i < eles.length; i++) {
              eles[i].innerHTML = replaceAst(eles[i].innerHTML, true);
            }
            var e = document.getElementsByTagName("body")[0];
            e.innerHTML = replaceAst(e.innerHTML, false);
          }
        /* ]]> */
        </script>
      </head>
      <body>
        <div>
          <button onclick="doIt();">Do it</button>
          <br />
          <div id="adiv"> </div>
          <h4><a href="some url">**url/pic.gif 20 25 icon** My link</a></h4>
          <p>**url/pic.gif 20 25 icon** My link</p>
        </div>
      </body>
    </html>
    david_kw

  3. #3
    Regular Coder Jesper Møller's Avatar
    Join Date
    Jun 2006
    Location
    Denmark, Copenhagen
    Posts
    138
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Thanks ..
    Im shur it will get me started
    "True knowledge exists in knowing that you know nothing."

    "Education is learning what you didn't even know you didn't know!"

  4. #4
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    I would have used a regular expression and DOM methods:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="txt/javascript">
    <script type="text/javascript">
    function replaceText(){
    var re=/\*\*+.+\*\*/;
    var att=['src','width','height','alt'];
    var elems=document.getElementsByTagName('*');
    var i=0, e;
    while(e=elems[i++]){
    	var j=0, k, s, p;
    		while(k=e.childNodes[j++]){
    			if(k.nodeType==3&&k.nodeValue.match(re)){
    				if(checkParents(k)){
    					s=k.nodeValue.split('**')[1].split(' ');
    					p=document.createElement('img');
    					setAtt(p,att,s);
    					k.parentNode.replaceChild(p,k);
    				}
    				else{k.data=k.data.replace(re,'');}
    			}
    		}
    }
    }
    function checkParents(k){
    var p=k.parentNode;
    while(p.nodeName!='BODY'){
    if(p.nodeName=='H4'){return true}
    p=p.parentNode;
    }
    return false
    }
    function setAtt(p,att,s){
    for(var i=0; i<att.length; i++){
    p.setAttribute(att[i],s[i]);
    }
    }
    </script>
    </head>
    <body>
    <button onclick="replaceText();">Replace Text</button>
    <br>
    <h4><a href="some url">**url/pic.gif 20 25 icon** My link</a></h4>
    <br>
    <p>**url/pic.gif 20 25 icon** My link</p>
    </body>
    </html>
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  5. #5
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nice. I really have to start thinking of the DOM way first. :) I'm way too brute force.


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •