Home > Developer > JavaScript
1. Juqery is an excellent javascript framework. It is a lightweight js library, compatible with CSS3, and compatible with various browsers (IE 6.0 +, FF 1.5 +, Safari 2.0 +, and Opera 9.0 + ), jQuery2.0 and later versions will no longer support IE6/7/8 browsers. JQuery allows you to easily process HTML documents, events, and animation effects, and provides AJAX interaction for websites.
Another major advantage of jQuery is its comprehensive documentation and detailed description of various applications. There are also many mature plug-ins to choose from. JQuery can ensure that the user's html page is separated from the code and html content. That is to say, you don't need to insert a bunch of JavaScript code in the html to call the command. You just need to define the id.
When using the jQuery2.0 framework, what I want to say through the above section is that if some code cannot run in eclipse, it indicates that the browser kernel is too low, you only need to display the effect in a browser of a higher version.
2. The jQuery library contains the following features:
· HTML element selection
· HTML element operations
· CSS operations
· HTML event Functions
· JavaScript special effects and animations
· Html dom traversal and Modification
· AJAX
· Utilities
3. Google and Microsoft have good support for jQuery.
If you do not want to store the jQuery library on your computer, you can load the CDN jQuery core file from Google or Microsoft.
Use Google CDN
Copy codeThe Code is as follows:
<Head>
<Script type = "text/javascript" src = "http://ajax.googleapis.com/ajax/libs
/Jquery/1.4.0/jquery. min. js "> </script>
</Head>
Use Microsoft CDN
Copy codeThe Code is as follows:
<Head>
<Script type = "text/javascript" src = "http://ajax.microsoft.com/ajax/jquery
/Jquery-1.4.min.js "> </script>
</Head>
Basic Syntax:
JQuery syntax example
$ (This). hide ()
Demonstrate the jQuery hide () function to hide the current HTML element.
$ ("# Test"). hide () // read id
Demonstrate the jQuery hide () function to hide the element id = "test.
$ ("P"). hide ()
Demonstrate the jQuery hide () function to hide all <p> elements. // You can directly read tags.
$ (". Test"). hide ()
Demonstrate the jQuery hide () function to hide all the elements of class = "test. // Read the Element Node of the class
There are many Jquery selector types: jQuery element Selector
JQuery uses the CSS selector to select HTML elements.
$ ("P") Select the <p> element.
$ ("P. intro") select all <p> elements of class = "intro.
$ ("P # demo") select all <p> elements of id = "demo.
JQuery attribute Selector
JQuery uses an XPath expression to select an element with a given attribute.
$ ("[Href]") selects all elements with the href attribute.
$ ("[Href = '#']") select all elements with an href value equal.
$ ("[Href! = '#'] ") Select all elements with an href value not equal.
$ ("Your href00000000'.jpg ']") select all elements whose href values end with ". jpg.
JQuery CSS Selector
The jQuery CSS selector can be used to change the CSS attributes of HTML elements.
The following example changes the background color of all p elements to Red:
Instance
Copy codeThe Code is as follows:
$ ("P" ).css ("background-color", "red ");
JQuery events
The following are examples of event methods in jQuery:
| Event Function | Bind a function |
| $ (Document). ready (function) | Bind the function to the ready event of the document (when the document is loaded) |
| $ (Selector). click (function) | Click events that trigger or bind a function to the selected Element |
| $ (Selector). dblclick (function) | Double-click event that triggers or binds a function to the selected Element |
| $ (Selector). focus (function) | Events that trigger or bind a function to the retrieved focus of the selected Element |
| $ (Selector). mouseover (function) | A mouse hover event that triggers or binds a function to the selected element. |
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
