This document is about Jquery, Study notes of Computer Programming

') .addClass('selected') .attr({ id : 'body', title : 'Welcome to jQuery' }) .text("Hello, World!");

Using jQuery (JS) library on HTML page

There are several ways to start using jQuery on your web site. ● Use the Google-hosted/ Microsoft-hosted content delivery network (CDN) to include a version of jQuery. ● Download own version of jQuery from jQuery.com and host it on own server or local filesystem. Note: All jQuery methods are inside a document-ready event to prevent any jQuery code from running before the document is finished loading (is ready).

Basic syntax for any jQuery function is:

$(selector).action() ● A $ sign is to define/access jQuery ● A (selector) is to “query (or find)” HTML elements in html page ● A jQuery action() is the action to be performed on the selected element(s) Example:

What jQuery can do for you?

● (^) Its simplistic, chainable, and comprehensive API has the capability to completely change the way you write JavaScript ● (^) With the goals of doing more with less code, jQuery really shines in the following areas: ○ (^) jQuery makes iterating and traversing the DOM much easier via its various built-in methods. ○ (^) jQuery makes selecting items from the DOM easier via its sophisticated, built-in, and ubiquitous capability to use selectors, just like you would use in CSS. ○ (^) jQuery makes it easy to add your own custom methods via its simple-to-understand plug-in Architecture. ○ (^) jQuery helps reduce redundancy in navigation and UI functionality, like tabs, CSS, and markup-based pop-up dialogs, animations, and transitions, and lots of other things.

● (^) Other JavaScript frameworks - Yahoo UI, Prototype, SproutCore, Dojo, and so on ● (^) jQuery frameworks erased lined between browsers (comprehensive API for event handling) ● (^) Other issues- cutting edge CSS properties & CSS gradients for example

WHO DEVELOPS JQUERY?

● (^) John Resig ● (^) www.ejohn.org ● (^) resides in Brooklyn, New York ● (^) Chief Software Architect at Khan Academy ● (^) John still helps with defining the direction and goals of the jQuery project, but jQuery has largely been transitioned to a large team of people ● (^) https://jquery.org/team/

Obtaining jQuery

● (^) www.jquery.com ● (^) A compressed production version (for production) ● (^) An uncompressed development version (for development)

Example 1-1.html

Example 1-1.js

Output

Programming Conventions Markup and CSS Conventions ● (^) When selecting id and class names, make sure that they are descriptive and are contained in a namespace. You never know when you might need to combine one project with another— namespaces help you to prevent conflicts. ● (^) When defining CSS, avoid using generic type selectors. Make your CSS more specific. This can also help with preventing conflicts. ● (^) Organize your files in a coherent manner. Group files from the same project in the same folder; separate multiple projects with multiple folders. Avoid creating huge file dumps that make it difficult to locate and associate files.