www.webdeveloper.com
Results 1 to 8 of 8

Thread: [RESOLVED] convert HTML Entities into normal characters

  1. #1
    Join Date
    May 2006
    Location
    the netherlands
    Posts
    454

    resolved [RESOLVED] convert HTML Entities into normal characters

    I'm using javascript to display some parts of the source-code from a webpage. This occasionaly contains HTML entities (& instead of &, é instead of , etc.) I want to convert these entities (&, é) back into normal characters (&, ). Of course i can do this with String.replace(), but the list of entities is kinda long, so i was hoping there is a simpler way that i'm unaware of.
    Anyone got any ideas?
    Free Scripts (PHP, Javascript, MySQL), homemade in the Excudo Devshed
    Create your own personal Startpage for free

  2. #2
    Join Date
    Feb 2006
    Posts
    2,927
    Put the text as is in an empty html element's innerHTML, then read the data value. No need to attach the element to the document tree.


    function get_ents(str){
    var temp=document.createElement("pre");
    temp.innerHTML=str;
    return temp.firstChild.nodeValue;
    }
    var str='Tom & Jerry';
    get_ents(str) returns 'Tom & Jerry'.
    Last edited by mrhoo; 01-25-2007 at 07:06 PM.

  3. #3
    Join Date
    Jan 2005
    Location
    Los Angeles, CA
    Posts
    4,887
    He's looking for a JavaScript equivalent of PHP's html_entity_decode function.

    A first attempt but it seems to work fine in both Firefox and IE.
    Code:
    <script type="text/javascript">
    function html_entity_decode(str){
    /*Firefox (and IE if the string contains no elements surrounded by angle brackets )*/
      try{
      var ta=document.createElement("textarea");
      ta.innerHTML=str;
      return ta.value;
      }catch(e){};
    /*Internet Explorer*/
      try{
      var d=document.createElement("div");
      d.innerHTML=str.replace(/</g,"&lt;").replace(/>/g,"&gt;");
      if(typeof d.innerText!="undefined")return d.innerText;/*Sadly this strips tags as well*/
      }catch(e){}
    }
    </script>
    <script type="text/javascript">
    alert( html_entity_decode("<span>&#191;Hablas bien el espa&ntilde;ol?</span>") );
    </script>
    Last edited by Ultimater; 01-25-2007 at 02:00 PM.

  4. #4
    Join Date
    May 2006
    Location
    the netherlands
    Posts
    454
    hey, that's a actually very clever solution

    unfortunately i can not make use of it. i'm using it as part of an xul application (firefox extension), so i can't create any divs
    Last edited by themarty; 01-26-2007 at 03:04 AM. Reason: typo
    Free Scripts (PHP, Javascript, MySQL), homemade in the Excudo Devshed
    Create your own personal Startpage for free

  5. #5
    Join Date
    May 2004
    Location
    FL
    Posts
    3,447
    Quote Originally Posted by Ultimater
    Code:
    <script type="text/javascript">
    function html_entity_decode(str){
    /*Firefox (and IE if the string contains no elements surrounded by angle brackets )*/
      try{
      var ta=document.createElement("textarea");
      ta.innerHTML=str;
      return ta.value;
      }catch(e){};
    /*Internet Explorer*/
      try{
      var d=document.createElement("div");
      d.innerHTML=str.replace(/</g,"&lt;").replace(/>/g,"&gt;");
      if(typeof d.innerText!="undefined")return d.innerText;/*Sadly this strips tags as well*/
      }catch(e){}
    }
    </script>
    <script type="text/javascript">
    alert( html_entity_decode("<span>&#191;Hablas bien el espa&ntilde;ol?</span>") );
    </script>
    Ah, another one for JSS???
    Lee

    ""Men occasionally stumble over the truth, but most of them pick themselves up and hurry off as if nothing ever happened."" -- Sir Winston Churchill

  6. #6
    Join Date
    Jan 2005
    Location
    Los Angeles, CA
    Posts
    4,887
    @themarty
    Kinda lazy to give the script a valid doctype and get it to pass the validator but it runs nonetheless test.xul
    Code:
    <?xml version="1.0"?>
    <root xml:lang="en" xmlns:html='http://www.w3.org/1999/xhtml'>
    <html:script type="text/javascript"><![CDATA[
    function html_entity_decode(str){
    var str1='<?xml version="1.0"?>\n'+
    '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"\n'+
    '"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\n'+
    '<html:html xml:lang="en" xmlns:html="http://www.w3.org/1999/xhtml">\n';
    var str2="</html:html>"
    var e=(new DOMParser()).parseFromString(str1+(str.replace(/</g,"&lt;").replace(/>/g,"&gt;"))+str2, "text/xml")
    return e.documentElement.textContent;
    }
    ]]></html:script>
    <html:script type="text/javascript"><![CDATA[
    alert( html_entity_decode("<span>&#191;Hablas bien el espa&ntilde;ol?</span>") );
    ]]></html:script>
    </root>
    Pretty sloppy but it should open up some new ideas.

    @LeeU, sure go ahead. For the link this time, please use my profile on the forums. http://webdeveloper.com/forum/member.php?u=30185
    Last edited by Ultimater; 01-25-2007 at 10:04 PM.

  7. #7
    Join Date
    May 2006
    Location
    the netherlands
    Posts
    454
    Quote Originally Posted by Ultimater
    Pretty sloppy but it should open up some new ideas.
    Yea, it definitely does!
    that DOMParser object does the trick. In the end i only had to copy & paste just that function to my javascript file and it works like a charm.
    Many thanks for this brilliant idea!
    Free Scripts (PHP, Javascript, MySQL), homemade in the Excudo Devshed
    Create your own personal Startpage for free

  8. #8
    Join Date
    Jan 2005
    Location
    Los Angeles, CA
    Posts
    4,887
    Got html_entity_decode down to:
    Code:
    function html_entity_decode(str) {
     var ta=document.createElement("textarea");
     ta.innerHTML=str.replace(/</g,"&lt;").replace(/>/g,"&gt;");
     return ta.value;
    }

Thread Information

Users Browsing this Thread

There are currently 2 users browsing this thread. (0 members and 2 guests)

Posting Permissions

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



Recent Articles