The beginning of jquery learning

Spit Groove

recently more annoying, for a front-end idiot, the direction of work suddenly turned to the front of this piece really makes a person egg pain incomparable. The previous period of time simple study of the next Easyui, it is a simple cognition of it. In the course of Easyui's research, it was found that it would be very difficult to follow the development without mastering JS and jquery. , and you have to learn jquery, a kind of sad egg. Always think the front of the water is very deep this period of time is an insight, hey, but work still continue, spit out the trough, the foot drive recharge it!

Objective

One of the front-end idiots, will point html+css+js. jquery's Learning books look at the "sharp jquery", first read the two chapters, feel able to understand, but also good. Future study also intends to adopt the book. Of course, it is also necessary to refer to some blog posts on the web (independent blogs).

Meet Jqueryjavascript

before you know jquery, it's important to understand the JavaScript.

A scripting language that enables a real-time, dynamic, and interactive relationship between Web pages and users, with more interactive elements in the Web page. The strength of its not to use my rookie to do more than repeat. However, there are some drawbacks of its own, resulting in the subsequent JS library generation. The main three major drawbacks:

• Complex Document Object Model (DOM)
• Inconsistent browser implementations
• Lack of convenient development and commissioning tools

based on the shortcomings of JavaScript above, in order to simplify the development of JS some JavaScript library was born. The JS library encapsulates a number of predefined objects and utility functions. You can create page interaction elements faster and more easily. Here for what JS library no longer talk about, focus on the next jquery, this is the focus of their follow-up study.

JQuery

A very good JavaScript library, the understanding of JS performance is also very well in place. jquery is becoming more popular now when the javasript gradually fade away (the table sprays me).

With its simple syntax and cross-platform compatibility, jquery greatly simplifies the way JS developers traverse HTML documents, manipulate the DOM, handle events, perform animations, and develop Ajax. Its unique and elegant code style changes the way JavaScript developers design ideas and write programs.

The main thrust of jquery is "wirteLess does more", writing fewer code and implementing more features. Whether you're a web designer, background developer, hobbyist or project manager, or JavaScript beginner or JavaScript whiz, there are plenty of reasons to learn jquery.

The advantages of jquery

JQ emphasizes the idea that "Wirte less,do more". JQ's unique selectors, chained DOM operations, event handling mechanisms, and well-encapsulated Ajax are not available to other JS libraries. In summary, the advantages of JQ are broadly divided into the following areas:

(1) Lightweight

jquery is very lightweight and Packer (http://dean.edwards.name/packer/), compiled by Dean Edwards, is less than 30kb in size. If you use the Min version and you enable gzip compression on the server side, the size is only 18kb.

(2) Powerful selector

Jqery allows developers to use almost all selectors from Css1 to CSS3, as well as jquery's original high-level and complex selectors.

(3) Excellent DOM operation Encapsulation

jquery encapsulates a large number of commonly used DOM operations, allowing developers to be handy when writing DOM operations related programs. jquery is easy to complete a variety of very complex operations, so that JS rookie can also write a good program.

(4) A reliable event handling mechanism

jquery's event-handling mechanism absorbs the essence of the event-handling functions written by JavaScript expert Dean Edwards, making jquery fairly reliable when dealing with event bindings. jquery is also doing very well in terms of fallback, progressive, and non-intrusive programming ideas.

(5) Perfect Ajax

jquery encapsulates all AJAX operations into a function $.ajax (), allowing developers to focus on the business logic while working with Ajax without worrying about browser compatibility and the creation and use of XMLHttpRequest objects.

(6) non-polluting top-level variables

jquery just creates an object called jquery, and all of its functions are under this object. The aliases can also be handed over at any time, without contaminating other variables, which allows jquery to coexist with JS and other JS libraries, with a reassuring reference to the project without having to take into account possible later conflicts.

(7) Excellent compatibility

As a popular JS library, jquery's browser compatibility is also very good.

(8) chain-operated

A set of actions that occur on the same JQ object can be ligatures directly without having to retrieve the object repeatedly. This chain-like operation makes the JQ code extremely elegant. And there is no need to get objects repeatedly to improve performance (the picker gets objects that are more consumable).

(9) Implicit Iteration

When you use JQ to find all the elements with the ". Class" class, you do not have to write loops to iterate through each returned element when you hide them. The methods in JQ are designed to be a collection of objects that are automatically manipulated, rather than individual objects, which makes a large number of fantasy structures unnecessary and optimizes the amount of code.

(10) separation of behavioral and structural layers

Developers can use the Jqery selector to get elements and then add events directly to the element. This idea of completely separating the behavior layer from the structure layer makes the jquery Developer page developers do their part, avoids unnecessary conflicts, and facilitates later maintenance, without the need to look for some Hansu in the HTML code and re-modify the HTML code.

(11) Rich plug-in support

jquery is easy to expand, which makes jquery-based open source plugins more and more understanding and better, with the help of some open-source plug-ins, to quickly build interactive applications.

(12) Open source.

jquery is an open source product that anyone can freely use and make suggestions for improvement. Open source makes a product more dynamic, it also promotes the continuous improvement of a product, while some new inspiration and ideas will also promote the deepening of the product. There are reasons to believe that open source jquery is becoming more and more popular.

jquery Kind

Simply understand the next jquery and then simply try jquery.

jquery Environment

1. Get jquery

Go to the jquery website: http://jquery.com/, download the latest jquery library.

2. jquery Library Type description

After the formal writing of the code, it is necessary to understand the following two types of jquery libraries: jquery xxx.min.js (Minified and gzipped) and jquery xxx.js (uncompressed)

The former is a jsmin and other tools to compress the version, the size of 54KB, if the server opened gzip compression, the size will be further reduced to 18kb. Main user products and projects.

The latter is a complete uncompressed version, the main user testing, learning and development.

3. jquery Environment Configuration

jquery does not need to be installed, just unzip to the relevant folder, development time in the HTML page to introduce the. js file.

Getting Started with jquery

A simple example: click on a div implementation to hide the div, compared to the native JS, the code is as follows:

The actual effect of this does not map, you can see the JQ compared to JS to get elements of the way more simple and fast, jquery suffix query is the meaning of the query, which may be the origin of the jquery name.

A simple understanding of jquery, but also for jquery has a cognitive bar, followed by some of the accumulation of knowledge points, over!