"this" in DOM.

[iyeru42]

I was wondering how to get JavaScript reference to a specific instance of a tag when mouse over and mouse out are triggered. As you can plainly see, I am trying to use the "this" object property so I don't end up editing a bunch of other tags (with the same ID and tag name or name.)So, can someone tell me how to set it up so I add 5 to the value of topmargin for the this object?

[Synook]

As you can plainly see

Err... see where?Anyway:

<script type="text/javascript">	function addmargin(ele) {		ele.style.marginTop = parseInt(ele.style.marginTop) + 5;	}</script>

And call as such: addmargin(this);

[justsomeguy]

In an event handler, this in IE points to the window object and is totally useless. It works as expected in Firefox and Opera. You can use this script to identify the event target in the event handler:

function doSomething(e) {	var targ;	if (!e) var e = window.event;	if (e.target) targ = e.target;	else if (e.srcElement) targ = e.srcElement;	if (targ.nodeType == 3) // defeat Safari bug		targ = targ.parentNode;}

[iyeru42]

In an event handler, this in IE points to the window object and is totally useless. It works as expected in Firefox and Opera. You can use this script to identify the event target in the event handler:

function doSomething(e) {	var targ;	if (!e) var e = window.event;	if (e.target) targ = e.target;	else if (e.srcElement) targ = e.srcElement;	if (targ.nodeType == 3) // defeat Safari bug		targ = targ.parentNode;}

A target event like... onMouseOver for a specific tag. That's no good, because I have several tags that need to do this, but only one at a time. And can't I make JS scan if the user uses IE and modify Synook's code appropriately? (Although then I'd have to code individual names to each tag >>

[justsomeguy]

You can set an event handler for any tag for any event that the tag supports. I just built an application that uses that type of code in the event handlers that I dynamically add for mousedown, mouseup, and mousemove events for arbitrary elements, or elements that I just created. It works fine, I'm not sure what the problem is. You can use the attachEvent or addEventListener methods to add that event handler to a certain element on a certain event.

[Reg Edit]

In an event handler, this in IE points to the window object and is totally useless.

You can use the attachEvent or addEventListener methods to add that event handler to a certain element on a certain event.

Attaching a function using addEventListener() changes the value of this. http://developer.mozilla.org/en/docs/DOM:e...e_value_of_this(And probably has different behaviour in different browsers...)

[justsomeguy]

Right, I'm saying you shouldn't use this at all to try to identify the target of the event, use that little chunk of code above instead, it will set targ to be the event target regardless of how you attach the event.