Mastering JavaScript

DOM Manipulation and Events
Here, we are passing a named function instead of an anonymous function to the
on() method. Let's shift our focus now to the event parameter that we pass to
the function. jQuery passes an event object with all the event callbacks. An event
object contains very useful information about the event being triggered. In cases
where we don't want the default behavior of the element to kick in, we can use the
preventDefault() method of the event object. For example, we want to fire an
AJAX request instead of a complete form submission or we want to prevent the
default location to be opened when a URL anchor is clicked on. In these cases, you
may also want to prevent the event from bubbling up the DOM. You can stop the
event propagation by calling the stopPropagation() method of the event object.
Consider this example:
$( "#loginform" ).on( "submit", function( event ) {
// Prevent the form's default submission.
event.preventDefault();
// Prevent event from bubbling up DOM tree, also stops any
delegation
event.stopPropagation();
});
Apart from the event object, you also get a reference to the DOM object on which the
event was fired. This element can be referred by $(this). Consider the following
example:
$( "a" ).click(function( event ) {
var anchor = $( this );
if ( anchor.attr( "href" ).match( "google" ) ) {
event.preventDefault();
}
});
Summary
This chapter was all about understanding JavaScript in its most important role—
that of browser language. JavaScript plays the role of introducing dynamism on the
web by facilitating DOM manipulation and event management on the browser. We
discussed both of these concepts with and without jQuery. As the demands of the
modern web are increasing, using libraries such as jQuery is essential. These libraries
significantly improve the code quality and efficiency and, at the same time, give you
the freedom to focus on important things.
We will focus on another incarnation of JavaScript—mainly on the server side. Node.js
has become a popular JavaScript framework to write scalable server-side applications.
We will take a detailed look at how we can best utilize Node.js for server applications.
[ 200 ]
www.it-ebooks.info