First steps in jQuery
The structure of jQuery is based on the factory function $()
. This function creates our working basis.
The factory function contains an argument which it operates with. The factory function equips the selected object with
new abilities - this process is called Wrapping. The newly generated object is referred to as a JQuery-object.
Once a new jQuery object is generated, new methods and properties can be assigned to it. One of these methods is .ready()
. This method is especially used when the jQuery-object is formed from
a document
-object (yes, this is a special case).
Code Example
First of all we ask whether the document is loaded:
$(document).ready();
Now we add an anonymous function:
$(document).ready(function(){
});
This function says that a new jQuery-object is formed from all paragraphs in the document.
$(document).ready(function(){
$("p")
});
Now we can add a method. In the following example we add the class red
to all paragraphs.
$(document).ready(function(){
$("p").addClass("red");
});
Even if this looks a bit complicated it's easier than you think. Just continue reading. We'll explain everything.
Which values can $() have?
jQuery supports CSS selectors from CSS 1.0 to CSS 3.0. There are also special jQuery/JavaScript
values like document
. We'll begin with CSS selectors and document
.
More details on .ready()
Ready is a basic method in the event-module of jQuery: a function which is passed to .ready
is
executed once the document is loaded.
Why do we need .ready()
If we executed $("p").addClass("test");
immediately we wouldn't get any results, because
at the moment there wouldn't be a document (It's not loaded yet).
Continue to part 3