jQuery
jQuery at w3 schools.. I hope you know this website already, otherwise it’s time to go take a look. Go on, follow the link.. Don’t be shy.
Quick summary:
- jQuery is a JavaScript library.
- jQuery greatly simplifies JavaScript programming.
- jQuery is easy to learn.
jQuery is a JavaScript library designed to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax. It is free, open-source software using the permissive MIT License.
jQuery is a library in your script of actions / methods through an API
Query’s syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax applications. jQuery also provides capabilities for developers to create plug-ins on top of the JavaScript library. This enables developers to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. The modular approach to the jQuery library allows the creation of powerful dynamic web pages and Web applications.
jQuery, at its core, is a Document Object Model (DOM) manipulation library. The DOM is a tree-structure representation of all the elements of a Web page. jQuery simplifies the syntax for finding, selecting, and manipulating these DOM elements. For example, jQuery can be used for finding an element in the document with a certain property (e.g. all elements with an h1 tag), changing one or more of its attributes (e.g. color, visibility), or making it respond to an event (e.g. a mouse click).
jQuery also provides a paradigm for event handling that goes beyond basic DOM element selection and manipulation. The event assignment and the event callback function definition are done in a single step in a single location in the code. jQuery also aims to incorporate other highly used JavaScript functionality (e.g. fade ins and fade outs when hiding elements, animations by manipulating CSS properties).
The principles of developing with jQuery are:
- Separation of JavaScript and HTML: The jQuery library provides simple syntax for adding event handlers to the DOM using JavaScript, rather than adding HTML event attributes to call JavaScript functions. Thus, it encourages developers to completely separate JavaScript code from HTML markup.
- Brevity and clarity: jQuery promotes brevity and clarity with features like “chainable” functions and shorthand function names.
- Elimination of cross-browser incompatibilities: The JavaScript engines of different browsers differ slightly so JavaScript code that works for one browser may not work for another. Like other JavaScript toolkits, jQuery handles all these cross-browser inconsistencies and provides a consistent interface that works across different browsers.
- Extensibility: New events, elements, and methods can be easily added and then reused as a plugin.
jQuery = JS Library -> memorize the boilerplate to use it.
1
2
<script src="text/jquery.js"></script>
jQuery doesn’t do anything on the page. It gives or adds a library to the page.
put this next code snippet at the end of your javascript script.
$(document).ready(function()){
// HERE COMES YOUR JQUERY CODE
}
- $ = value given to library
1
$("#panelHelloWorld").hide(300)
This hides a html panel with ID=”panelHelloWorld”, so jQuery uses HTML ID’s to target a specific element in your DOM
Start daily exercises in the Code Gym