SageFix. LetsFix!  
Current Location : Home > Web Development > JavaScript > Now here's a puzzler.....! Share/Save/Bookmark    

Main Menu
SageFix - Let's Fix

Board Categories
    Web Site Designing
- Graphics
    Web Development
- .NET
- Classic ASP
- JavaScript
- PHP
    WebSite Management
- Promotion Techniques
- Search Engine Optimization
    Databases
- MySQL

Tutorials

Database Connection Strings

  Contact Us


 1 - 30 of 30 [Total 1 Pages]  
Now here's a puzzler.....!       Jul 13, 2002, 06:57 1
  
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:
Quote:
innerText: £
and the other displaying this:
Quote:
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:
Quote:
<b>& pound;</b>
not this:
Quote:
<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!)

 
      Jul 28, 2002, 14:44 2
  
Quote:

It's a joke Marco
That much I had followed. It now makes more sense, but who's Gareth?

 
      Jul 15, 2002, 14:55 3
  
Just admit defeat M@rco - it's a feature!

Goof

 
      Jul 15, 2002, 15:20 4
  
Admit defeat? Never!

 
      Jul 15, 2002, 15:30 5
  
Crazy Brit!

 
      Jul 15, 2002, 17:05 6
  
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

 
      Jul 16, 2002, 01:35 7
  
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

 
      Jul 16, 2002, 13:43 8
  
Worth a shot, I suppose...! I won't hold my breath though...

 
      Jul 17, 2002, 01:20 9
  
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

 
      Jul 27, 2002, 07:45 10
  
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!

 
      Jul 27, 2002, 07:48 11
  
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

 
      Jul 27, 2002, 08:01 12
  
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!

 
      Jul 28, 2002, 15:55 13
  
Flawless_koder = Gareth

 
      Jul 14, 2002, 15:34 14
  
Anybody out there?

 
      Jul 27, 2002, 08:04 15
  
Like I'm NOT working flat out right as we speak

Flawless

 
      Jul 27, 2002, 08:07 16
  
CharEntities.js
Code:
//create character entity lookup objectvar CharEntities = new Object();//lowercase foreign charactersCharEntities["à"]="& 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 charactersCharEntities["À"]="& 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["Y"]="& Yuml;";//currenciesCharEntities["£"]="& 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;";//symbolsCharEntities["°"]="& 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! )

 
      Jul 27, 2002, 08:12 17
  
Quote:

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

 
      Jul 27, 2002, 15:06 18
  
Quote:

.oO( that'd be 17/7 then - wouldn't it Gareth )
You've lost me.....!

 
      Jul 28, 2002, 05:43 19
  
I'm at work about 17 hours a day - 7 days a week.
It's a joke Marco

he he

Flawless

 
      Jul 28, 2002, 16:52 20
  
Gotcha! (DOH!)

 
      Jul 15, 2002, 02:20 21
  
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

 
      Jul 15, 2002, 02:23 22
  
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

 
      Jul 29, 2002, 02:13 23
  


Oh my - that's got me laughing.

Flawless

 
      Jul 29, 2002, 02:19 24
  
congrats flawless i see you hit the big 1000

 
      Jul 15, 2002, 09:29 25
  
Cheers, Flawless - keep trying!

I think I'll send it in to the appropriate MSDN column to see what they say!!

 
      Jul 15, 2002, 09:41 26
  
hmmmmmmmmmmmm

*re-reads post*

For the first popup i'm getting

Code:
innerText: & pound;
and the second:

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

 
      Jul 29, 2002, 02:21 27
  
lol - shoulda seen it coming!

It's scary to think how much time i have available for this place.

I've settled into a right old routine of checking up on things here first thing in the morning and throughout the day.

Anywayz - back to the grind stone.

Flawless

 
      Jul 15, 2002, 09:48 28
  
Quote:

(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

 
      Jul 15, 2002, 09:50 29
  
whooops...

 
      Jul 15, 2002, 11:46 30
  
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)

 
 1 - 30 of 30 [Total 1 Pages]  









Subscribe to our mailing list
email


Current Location : Home > Web Development > JavaScript > Now here's a puzzler.....! Share/Save/Bookmark    

Development problem? SageFix is completely free -- paid for by advertisers and donations. Click here to Contact Us If you have any query. Enjoy!
Request processed in 0.00012 seconds Home - Contact Us - Terms Of Service - Privacy Policy - Copyrights - Top
Advertisements do not imply our endorsement of that product or service.
Current server time now is 14-Mar-2010 14:02:42
Copyright © 2009 Sagefix Inc. All rights reserved.
Powered By SageFix