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
    135
    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
    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
    Regular Coder Jesper Møller's Avatar
    Join Date
    Jun 2006
    Location
    Denmark, Copenhagen
    Posts
    135
    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
    Kor
    Kor is offline
    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
    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
    •