In Javascript, by what mechanism does setting an Image src property trigger an image load?
- by brainjam
One of the things you learn early on when manipulating a DOM using Javascript is the following pattern:
var img = new Image(); // Create new Image object
img.onload = function(){
// execute drawImage statements here
}
img.src = 'myImage.png'; // Set source path
As far as I know, in general when you set an object property there are no side effects. So what is the mechanism for triggering an image load? Is it just magic? Or can I use a similar mechanism to implement a class Foo that supports a parallel pattern?
var foo = new Foo(); // Create new object
foo.barchanged = function(){
// execute something after side effect has completed
}
foo.bar = 'whatever'; // Assign something to 'bar' property
I'm vaguely aware of Javascript getters and setters. Is this how Image.src triggers a load?
