Introduction to jquery Introductory knowledge _jquery

Source: Internet
Author: User
So far jquery has been released to 1.4.2, and in the week before that they just released the 1.4 version, to see his version of the release time, it is not difficult to find his rapid development, every month in the update version; and someone has been developing new jquery Plug-ins, and recently launched a JQuery UI Library
jquery was unveiled on January 14, 2006 in BarCamp NYC (New York city). Lord John Resig, who wrote "Pro JavaScript techniques," because of the mozolla, it is said that Firefox 3 will contain jquery, now the jquery team has major developers, extension staff, UI, plug-in development, Website design maintenance, of which 3 major developers are: Two Americans John Resig/brandon Aaron, a German Jorn Zaefferer)
Here's a quick introduction to some of the features and usage of jquery:
1. Accurate and simple Selection object (DOM):
Copy Code code as follows:

$ (' #element ');//equivalent to document.getElementById ("element")
$ ('. element ');//class
$ (' P ');//html label
$ ("form > Input");//child objects
$ ("Div,span,p.myclass");//Select multiple objects at the same time
$ ("tr:odd"). CSS ("Background-color", "#bbbbff");//table interlacing background
$ (": input")//Form Object
$ ("input[name= ' newsletter ']");//Specific Form Object

2, the application of the object function is simple and unrestricted:
Copy Code code as follows:

Element.function (PAR);
$ ("P.surprise"). AddClass ("Ohmy"). Show ("Slow") ...

3. Action on selected objects (including styles):
Copy Code code as follows:

$ ("#element"). AddClass ("selected");//Add Style to Object
$ (' #element '). CSS ({"Background-color": "Yellow", "font-weight": "Bolder"}); Change object style
$ ("P"). Text ("Some new text."); /Change Object text
$ ("img"). attr ({src: "test.jpg", alt: "Test Image"});//Change Object text
$ ("P"). Add ("span");//Add label to Object
$ ("P"). FIND ("span");//Look up the corresponding element within the object
$ ("P"). parent ();//object's Parental element
$ ("P"). Append ("<b>Hello</b>");//Add content to Object

4, support AJAX, supporting file format: XML/HTML/SCRIPT/JSON/JSONP
Copy Code code as follows:

$ ("#feeds"). Load ("feeds.html")//Area import static page content
$ ("#feeds"). Load ("feeds.php", {limit:25}, function () {alert ("The last entries in the feed have been loaded"); /Import Dynamic Content

4. Support for events:
Copy Code code as follows:

$ ("P"). Hover (function () {
$ (this). addclass ("Hilite");//mouse when put up
}, function () {
$ (this). Removeclass ("Hilite");//Remove mouse
)//mouse to put up and remove different effects (automatically loop all P objects)

5, Animation:
Copy Code code as follows:

$ ("P"). Show ("slow");//hidden Object (slow gradient)
$ ("#go"). Click (function () {
$ ("#block"). Animate ({
Width: "90%",
Height: "100%",
FontSize: "10em"
}, 1000);
//mouse clicks wide, high, font dynamic changes

6, Expansion:
Copy Code code as follows:

$.fn.background = function (BG) {
return this.css (' background ', BG);
};
$ (#element). Background ("Red");

If you want to add a function to each JQuery object, you must assign the function to $.fn, and the function must return a This (jquery object)
jquery related
"Learning jquery:better interaction Design and Web Development with simple JavaScript techniques" The first book on how to Learn jquery, written by jquery developers, was published in July, with three related books in the Open.
Jquerycamp 2007, a jquery developer's meeting will be held in Boston on October 27.
Visualjquery is a jquery learning and querying website that has also been updated to the 1.1.2 version.
jquery website Introduction translation:
jquery is a JavaScript library that has never been before.
He is quick and concise, and can easily handle HTML documents, control events, add animations to pages, and Ajax effects.
jquery is designed to change the way JavaScript is written.
He is for everyone: designers, developers, geeks, business applications ...
Small size: 26.5KB (1.2.1 compression version), 45.3KB (1.2.1 Lite), 78.6KB (1.2.1 full version) ... 20.7KB (1.1.2 compressed version), 57.9KB (full version 1.1.2)
Compatibility: Support for CSS 1-3 and basic XPath
Cross-browser: IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+ (Backward compatible)
jquery Plug-ins:
Ajax/animation and effects ()/browser tweaks (6)/data (/dom)/drag-and-drop (6)/events (/forms)/integ Ration (a)/javascript (a)/jquery Extensions (a)/layout (a)/media (/menus) (a)/navigation Interface (/utilities)/widgets (a)/windows and overlays (4)

jQueryUI Library:
Basic Mouse Interaction: Drag (drag and dropping), sort (sorting), select (selecting), Zoom (resizing)
Various interactive effects: Accordion folding Menu (accordions), calendar (date pickers), dialog box (dialogs), slider (sliders), table sorting (table sorters), tab (tabs), Magnifier effects ( Magnifier), Shadow effect (shadow)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.