Introduction to Jquery 1

Source: Internet
Author: User

For web developement, I want to explain my understanding and summary of Jquery knowledge. I hope to help you and welcome comments.

Introduction: jquery was created by John Resig, an American. jquery's purpose is: writer less. do more can learn more about jquery in www.jquery.com.
Jquery is a javascript-Based Query Library. Of course, if you think it can only do this kind of thing, you will be too small to look at it. We can use jquery to achieve a lot of Dynamic html effects, can easily perform ajax requests, etc.

History: jquery is another excellent lightweight javascript framework js library inherited from prototype. It has strong compatibility and is compatible with most browsers. In terms of page processing, jquery can
It makes it easier to process html, document, and events to achieve dynamic results and provide convenient ajax interaction. jquery can effectively separate html code and avoid js calls embedded in html.
 
Five Basic Data Types in javacript: undefined, null, boolean, string, number
 
Basic jquery usage:
TypeOf () verifies the return of the keyword type
$ (Document). ready (function (){
// This is the basic of jquery. It is executed when html Dom elements are loaded but their associations are not completed.
});
$ ("A"). click (function (){
// When html Element a is triggered by the click Event
});
$ ("# SharmeId"). click (function (){
// When the element whose html element Id is sharmeId is triggered by the click event
});
// Add sub-elements. Here, note that the html () function has two functions in jquery. If the parameter body is not put, the html () content is obtained, if this parameter is set, the content is set to sharmeId.
$ ("# SharmeId" pai.html ("
<Font color = 'red'> sharme Yao </font>
");

Selector usage:
Every object in jquery has the length attribute.
Here I want to talk about the differences between the onload () function in html and the ready () function in jquery:
The former indicates that the entire DOM element in html has been loaded, and the association between them has been completed before execution, while the latter indicates that the entire DOM element has been loaded, however, the associated relationships between them have been executed before loading.
 
The following are some filtered content for the selector in jquery.
Basic selector:
$ ("# Id") finds the corresponding element based on the Id. If no element exists, an empty jquery object is returned.
$ (". Class") More css class attributes to find the corresponding elements, return the collection object
$ ("P") select all P tag Elements
$ ("*") Searches for all elements and returns all elements.
$ ("Div, span, p") returns the result after every selector is merged.
Level selector:
$ ("Body div" ).css ("background", "red"); changes the background color of all div elements under the body.
$ ("Body> div" ).css ("background", "red"); change the background color of the direct child element of the body.
$ (", One + next" ).css (...); operate the style of the next element whose class is one
$ ("# One ~ Div ") Get the set of all sibling elements with the ID of one.
$ ("# One"). next ("div" ).css (); find that the ID is one, and the next div Element Object
$ ("# One"). nextAll ("div" ).css (); find all div element objects after the ID is one
$ ("# One"). siblings ("div" example .css () Find the sibling element of all the divs whose ID is one.
 
Due to time, I will give you a more in-depth understanding of selector and jquery animation next time. If you have any bad ideas, thank you.

From sharme's column

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.