Overview
JQuery is a popular JavaScript library that is used extensively in modern websites. This library facilitates common JavaScript tasks such as animations, event handling, manipulating HTML content, and communication with external servers. In addition to its easy-to-use features, JQuery also takes care of many cross-browser compatibility issues automatically.
Prerequisites
HTML: The student must know how to use HTML tags and attributes. Only a very basic understanding of HTML is assumed.
JavaScript: Since JQuery is a JavaScript library, the student must know how to write JavaScript. JQuery makes extensive use of functions and objects, so the student must be familiar with these concepts.
Notepad++ (Recommended): Notepad++ is a free, open-source text editor. Although JavaScript and HTML can be written using any text editor, Notepad++ is highly recommended because of features such as syntax highlighting and auto-complete.
JavaScript-enabled browser: In order to run JavaScript, the student must have a
ccess to a JavaScript-enabled browser. Although Google Chrome is used throughout the tutorial, any modern web browser will work as long as JavaScript has not been disabled by an administrator.
What you will learn
We will begin the course by learning about selectors. Selectors are strings that are used to target specific HTML elements on the page. The selector syntax is highly intuitive and easy to read and understand.
We will then move on to events. The student will learn how to write code that reacts to things like mouse clicks, key presses, when the page is done loading, and a few others. These events allow programmers to create interactive user interfaces.
After that, we will move on to effects and animations. Effects are used to hide and show elements. An example would be a menu that slides open when the mouse hovers over it. JQuery has a few built-in effects that can be implemented with minimal coding. For further customization, we will look at animations, which allow programmers to animate most of the visual properties of HTML elements.
Then we will learn about changing the HTML content of a webpage. This includes adding and removing entire HTML elements, as well as modifying text and other HTML attributes programmatically. We will also learn about how to navigate the tree-like structure of an HTML document using the concept of parent-, sibling-, and child-elements.
Finally, we will end the course by looking at AJAX, which stands for Asynchronous JavaScript and XML. AJAX allows programmers to interact with external servers. To serve as our example, we will read airport data from a public web service. We will learn how to request data, how to handle the response, and how to handle errors.