SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 31

Hybrid View

  1. #1
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Now here's a puzzler.....!

    It is with great satisfaction that I at last post the first problem that I haven't been able solve myself(!!!), and simultaneously reach my 800th post!

    I am trying to get retrieve the inner HTML (i.e. the HTML in between the <a> and </a> tags) of an anchor tag when I click on the link. This should be easy enough to do using the .innerHTML property, and indeed it is most of the time, but there appears to be an exception when it comes to character entities (e.g. "& pound;" - please note that spaces have been intentionally inserted where needed throughout this post in order to overcome the usual shortcomings in vB's handling of HTML code)

    At this point I should probably point out that in this particular case I'm not concerned with cross-browser compatibility - I only need this to work in IE4 and up.

    Here's some simple test code to demonstrate the problem:
    Code:
    <script language="JavaScript">
    	function DisplayValue(obj)
    	{
    		alert("innerText: " + obj.innerText);
    		alert("innerHTML: " + obj.innerHTML);
    	}
    </script>
    <a title="Pound sterling" onClick="DisplayValue(this);" href="#"><b>& pound;</b></a>
    So, in theory, when the pound sign is clicked on, two alert boxes should appear - one displaying this:
    innerText:
    and the other displaying this:
    innerHTML: <b>& pound;</b>
    Right?

    Wrong, unfortunately!!! The first displays as expected, but the second displays this:
    Code:
    innerHTML: <b></b>


    So, the question is, how can I obtain the _exact_ HTML that is present between the tags via JavaScript? If .innerHTML doesn't work then what does?

    For total clarification, what I want is this:
    <b>& pound;</b>
    not this:
    <b></b>
    Also, I am well aware that I could do something like this:
    Code:
    <script language="JavaScript">
    	function DisplayValue(obj,val)
    	{
    		alert("innerText: " + obj.innerText);
    		alert("innerHTML: " + val);
    	}
    </script>
    <a title="Pound sterling" onClick="DisplayValue(this,'<b>& pound;</b>');" href="#"><b>& pound;</b></a>
    but although this works, it is an unnecessary duplication, and not what I want.

    You would have thought that returning the unparsed HTML code from the contents of an element would be pretty elementary (pun intended), but it seems that it is not! It must be possible to do such a basic thing!

    So, answers on a postcard to the usual address.....!
    (Thinking caps on, everyone!)
    Last edited by M@rco; Jul 13, 2002 at 11:16.
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  2. #2
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Anybody out there?
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  3. #3
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Out of curiosity i swapped & pound for & #163;

    And guess what?!

    yes - it didn't work

    At least the browser is being consistant

    Still looking at it.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  4. #4
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've come up dry so far...

    ... Might take a look at the W3C specifications for the underlying structure if i get a chance later.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  5. #5
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cheers, Flawless - keep trying!

    I think I'll send it in to the appropriate MSDN column to see what they say!!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  6. #6
    + platinum's Avatar
    Join Date
    Jun 2001
    Location
    Adelaide, Australia
    Posts
    6,441
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmmmmmmmmmmmm

    *re-reads post*

    For the first popup i'm getting

    Code:
    innerText: & pound;
    and the second:

    Code:
    innerHTML: <B>&amp; pound;</B>

  7. #7
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Re: Now here's a puzzler.....!

    Originally posted by M@rco
    (e.g. "& pound;" - please note that spaces have been intentionally inserted where needed throughout this post in order to overcome the usual shortcomings in vB's handling of HTML code)
    Note his words.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  8. #8
    + platinum's Avatar
    Join Date
    Jun 2001
    Location
    Adelaide, Australia
    Posts
    6,441
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    whooops...

  9. #9
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    DOH! Will no-one rid me of this turbulent IE problem?!!
    (Have sent an email to Microsoft's WebTeam, perhaps they might come up with something)
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  10. #10
    SitePoint Wizard Goof's Avatar
    Join Date
    Feb 2001
    Location
    Pittsburgh, PA
    Posts
    1,154
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just admit defeat M@rco - it's a feature!

    Goof
    Nathan Rutman
    A slightly offbeat creative.

  11. #11
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Admit defeat? Never!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  12. #12
    SitePoint Wizard Goof's Avatar
    Join Date
    Feb 2001
    Location
    Pittsburgh, PA
    Posts
    1,154
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Crazy Brit!
    Nathan Rutman
    A slightly offbeat creative.

  13. #13
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I actually mentioned this to m@rco while trying to come up with a solution for this, but i came up as dry as anyone else.

    Now if you do something like this

    this.parentNode.parentNode.parentNode.innerHTML

    microsoft actually interprets the page completely differently as to how you would expect it tobe

    with quotes being dropped and attributes capitalised etc, something someone might wanna have a look into.

    anyway let me know if you came up with anything

  14. #14
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think the best you can hope for in this case is a hotfix Marco - and in that case you're stuck anyway.

    Best to run regex on it...

    matching /&\([^\s]\)\+;/ and then using \1 to put it back in might be enough to trigger the browser to recognise it.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  15. #15
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Worth a shot, I suppose...! I won't hold my breath though...
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  16. #16
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    lol - i didn't test that regex ( as per usual )
    so let me know if it doesn't work and i'll check it over.

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  17. #17
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile The workaround.....!

    Didn't think it would work - the character entities seem to get resolved as the page is rendered, and once that has happened, then nothing can get them back!!!

    Microsoft were useless - they couldn't even be arsed to acknowledge the emails I had sent! Just completely ignored me.

    However, having thought a little further ahead, I came up with a neat solution to that problem and a related one....

    (Incidentally, the reason that I wanted to use character entities in this way is that I was writing a popup panel for my CMS content editor which would let users enter foreign characters and sybols, in a similar way to Windows Character Map.)

    Rather than worry about inserting the correct HTML character entities at the point at which they are clicked on in the character map, I am letting the foreign characters go straight through, and I then process the entire HTML page later.

    My conversion function works by using a hardcoded associative array (created by using expando properties), and then looping through each foreign character/symbol in the array, replacing each instance of it in the HTML page with the corresponding character entity.

    This means that if users enter foreign characters directly into my content editor WITHOUT using my character map (perhaps using a foreign keyboard, or Windows Character Map), then these characters are caught and converted! Thus, no foreign character or symbol survives intact - by the time it reaches the DB for storage, they've all been converted.

    I run this filter on the HTML code when the content editor loads, when it saves & closes, and when the user switches to HTML code view (from WYSIWYG mode).

    So, in the end the .innerHTML property behaving badly didn't matter, but I would STILL like to know if it is possible to get those character entities back without having to use a lookup table...!

    If this explanation isn't clear (I'm in a hurry at the moment), then please say so and I'll elaborate!

    Thanks to everyone that tried to help, but it seems that we have been defeated by Microsoft's poor programming yet again!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  18. #18
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well now you've said that Marco - you'll have to investigate
    whether or not this problem comes up in all other browsers...
    Not just Microsoft's and Netscape's

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  19. #19
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, the .innerHTML is an IE-only feature (although NS6 added it too because developers wanted it so much... perhaps Opera may have done the same).

    It might be interesting to know (just for the record), but it's pretty low down on my list of priorities right now....!

    If you check it out before I do, please post the results here!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  20. #20
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Like I'm NOT working flat out right as we speak

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  21. #21
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    CharEntities.js
    Code:
    //create character entity lookup object
    var CharEntities = new Object();
    
    //lowercase foreign characters
    CharEntities[""]="& agrave;"; CharEntities[""]="&  aacute;"; CharEntities[""]="& auml;";
    CharEntities[""]="& egrave;"; CharEntities[""]="& eacute;"; CharEntities[""]="& euml;";
    CharEntities[""]="& igrave;"; CharEntities[""]="& iacute;"; CharEntities[""]="& iuml;";
    CharEntities[""]="& ograve;"; CharEntities[""]="& oacute;"; CharEntities[""]="& ouml;";
    CharEntities[""]="& ugrave;"; CharEntities[""]="& uacute;"; CharEntities[""]="& uuml;";
    CharEntities[""]="& ccedil;"; CharEntities[""]="& yuml;";
    
    //uppercase foreign characters
    CharEntities[""]="& Agrave;"; CharEntities[""]="& Aacute;"; CharEntities[""]="& Auml;";
    CharEntities[""]="& Egrave;"; CharEntities[""]="& Eacute;"; CharEntities[""]="& Euml;";
    CharEntities[""]="& Igrave;"; CharEntities[""]="& Iacute;"; CharEntities[""]="& Iuml;";
    CharEntities[""]="& Ograve;"; CharEntities[""]="& Oacute;"; CharEntities[""]="& Ouml;";
    CharEntities[""]="& Ugrave;"; CharEntities[""]="& Uacute;"; CharEntities[""]="& Uuml;";
    CharEntities[""]="& Ccedil;"; CharEntities[""]="& Yuml;";
    
    //currencies
    CharEntities[""]="& pound;";
    CharEntities[""]="& euro;";
    //doubly escaped because '$' is a special character in regular expressions,
    //and is also evaluated as a JS string in the code below!!
    CharEntities["\\$"]="& #36;"; 	
    CharEntities[""]="& cent;";
    CharEntities[""]="& yen;";
    
    //symbols
    CharEntities[""]="& deg;";
    CharEntities[""]="& frac12;"; CharEntities[""]="& frac14;"; CharEntities[""]="& frac34;";
    CharEntities[""]="& plusmn;";
    CharEntities[""]="& #8220;"; CharEntities[""]="& #8221;";
    CharEntities[""]="& #8216;"; CharEntities[""]="& #8217;";
    CharEntities[""]="& #8211;";
    
    
    function ConvertCharsToEntities(str)
    {
    	for (c in CharEntities)
    	{
    		re = "/" + c + "/g"
    		str = str.replace(eval(re),CharEntities[c])
    	}
    	return str;
    }
    example usage:
    Code:
    NewHTML = ConvertCharsToEntities(OldHTML);


    Edit:

    bloody vB character entity handling..... worked around as per usual (mind the gap! )
    Last edited by M@rco; Jul 27, 2002 at 07:10.
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  22. #22
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Flawless_koder
    Like I'm NOT working flat out right as we speak

    Flawless
    Which is why you're STILL reading & replying to my posts on the forums here.....! lol
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  23. #23
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I always make time for Sitepoint while i'm at work...
    ...
    .oO( that'd be 17/7 then - wouldn't it Gareth )

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  24. #24
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Flawless_koder
    .oO( that'd be 17/7 then - wouldn't it Gareth )
    You've lost me.....!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  25. #25
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm at work about 17 hours a day - 7 days a week.
    It's a joke Marco

    he he

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---


Bookmarks

Posting Permissions

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