View Full Version : Internet Explorer textNode events

07-03-2006, 04:04 PM
Hi all.

I've been searching for a while, but have not come up with anything useful here, on Google, or other forums. My question is regarding block elements having multiple text child nodes, and handling onClick events in Internet Explorer.

Let's say I have the following HTML:

<div id="id1">
Here is some text
<a href="some url" id="id2">Here is some text inside a link</a>
Here is some more text

Is there a way in IE (using javascript) to determine on a mouse click which one of the text nodes ('Here is some text' or 'Here is some more text') has been clicked by the user?

I know Mozilla will consider a text node the target of an event, and IE will not. Is there some variable or object that holds more information about which node was clicked in IE? Or maybe a way to determine which node was clicked based on mouse coordinates?

I know how to do this for regular tag elements, but not for text nodes.

Any help or suggestions will be appreciated.

Thanks in advance,

07-03-2006, 06:46 PM
all text nodes should be encased in <span> elements.

then inMouseDown tage target.srcElement to determine the HTML element you are clicking on.

Work with the object like that


var clickedON =target.srcElement;
clickedON.style.backgroundColor = "#efefef";

07-03-2006, 07:21 PM
That definitely works, but the problem is, that I don't have control over the html. The html will be provided by the user, so there is no guarantee that all text will be encapsulated in <span>s.

That is actually what made me post the question in the first place...
Do you have other suggestions? I'm looking for a way to do this without modifying the provided html.


07-03-2006, 09:52 PM
parse the wrapping DOM node.

When you grab a peice of 'text' (i.e. you have a <div>with text in it</div> so


you are grabbing the text.

the text is 'textNodes' at that point and you can work with them like so.

07-03-2006, 10:45 PM
Right. But what if I have:

<div> text1 <br/> text2 </div>

The <div> will be the srcElement that will receive the click event. At that point, srcElement.childNodes will contain 3 children: text1, <br/>, and text2.
srcElement.textNodes will contain: text1, and text2.

The same event will fire if the user clicks on either of text1 or text2. How can I find out which of those 2 was clicked? As far as I know, the window.event object of the Internet Explorer will not carry any such information.