Solved

Any difference between onmouseover='src="img1.gif"' and onmouseover='this.src="img1.gif"'

Posted on 2007-12-05
5
4,666 Views
Last Modified: 2008-02-01
I just realized that when I assign a function to an event, I've been randomly using either,
onmouseover='src="img1.gif"'
or
onmouseover='this.src="img1.gif"'

and either of them work just fine

Are there any differences in those two?
I see more people are using this.src=..., are there any problems with just doing src=...

I had posted exactly the same question at http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_22981856.html but I mistakenly accepted the solution without testing it. :-(

What Zvonko said in there is not quote true since it still works when I had a global variable named src...
0
Comment
Question by:nagunpyo
5 Comments
 
LVL 9

Expert Comment

by:sognoct
ID: 20410073
In JavaScript this always refers to the owner of the function we're executing, or rather, to the object that a function is a method of. When we define our faithful function doSomething() in a page, its owner is the page, or rather, the window object (or global object) of JavaScript.

read there

http://www.quirksmode.org/js/this.html
0
 
LVL 11

Expert Comment

by:raj3060
ID: 20412109
onmouseover='src="img1.gif"'
or
onmouseover='this.src="img1.gif"'

Both would work if you have focus on the element where you have this script.

onmouseover='this.src="img1.gif" id preferable as you are mentioning what value to take for the object.
0
 
LVL 11

Expert Comment

by:raj3060
ID: 20412114
should be read:

onmouseover='this.src="img1.gif" is preferable
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 20412406
Hi,

I've only had 1 mug of espresso so far, so the following may be somewhat disorganized :)

As you may have noticed, both IE & FF handle "src" & "this.src" in the same manner because of the reason stated by sognoct (above).  Essentially, 'this' relates to whatever you are referring.  In your case, 'this' refers to the mousedover's image source.  Since javascript assumes 'this', there is no functional difference.

Wat Zvonko said about global variables & naming conventions is true (but not fully explained). If you have two variables with the same name (whether one is a keyword or not) and one is declared global & the other local, you will not always end up with the results expected.
   Local variables lose their scope (die/cease to exist) when they leave the function; global variables retain their values until explicitly changed.
  Older browsers tended to confuse keywords & variable names under certain conditions, which made the usage of 'this' popular.
0
 
LVL 16

Accepted Solution

by:
LeeKowalkowski earned 500 total points
ID: 20613553
this.src and src are only equivalent on elements that have a src property, otherwise this.src will set the property on the element and src will set the property on the window object.

For instance:

<img onmouseover="foo='bar';" onmouseout="alert(this.foo);" ... >

- doesn't work because foo is assigned to the window object, not the img element.

And:

<img onmouseover="this.foo='bar';" onmouseout="alert(foo);" ... >

- does work! (not tested *every* browser though)

I think it's better practice to be explicit and always use 'this' in event handlers, to avoid accidental scope-leak at least.

--
Lee
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Batch, VBS, and scripts in general are incredibly useful for repetitive tasks.  Some tasks can take a while to complete and it can be annoying to check back only to discover that your script finished 5 minutes ago.  Some scripts may complete nearly …
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Learn the basics of lists in Python. Lists, as their name suggests, are a means for ordering and storing values. : Lists are declared using brackets; for example: t = [1, 2, 3]: Lists may contain a mix of data types; for example: t = ['string', 1, T…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now