Jquery features, advantages and disadvantages and Common Operations

1. What is jquery?
Jquery is an excellent JavaScript framework.
Jquery is another excellent JavaScript framework after prototype. Its purpose is to write less, do more, and write lessCodeTo do more things. It is a lightweight JS library, which is not suitable for other JS libraries. It is compatible with css3 and various common browsers.
Jquery is a fast and concise JavaScript library that allows you to easily process HTML documents, events, animation effects, and provide 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.

2. jquery features
(1). A lightweight JS framework.
The jquery core JS file is dozens of KB and does not affect the page loading speed. It is much lighter than extjs.
(2). Rich Dom selector (CSS1-3 + XPath)
Jquery's selector is very convenient to use. For example, to find the adjacent element Js of a DOM object, several lines of code may need to be written, while jquery's one line of code is done, for example, to change the line color of a table, jquery is also a line of code.
(3). chained expression.
Jquery's chain operation can write multiple operations in a single line of code, which is more concise.
(4) events, styles, and animations.
Jquery also simplifies CSS code operations in Javascript, and the code is more readable than Js.
(5). Ajax operation support.
Jquery simplifies Ajax operations. The background only needs to return a JSON string to complete communication with the foreground.
(6) cross-browser compatibility.
Jquery is basically compatible with mainstream browsers and does not have to worry about browser compatibility issues.
(7). Extension development of plug-ins.
Jquery has a wide range of third-party plug-ins, such as tree menus, date controls, image switching plug-ins, pop-up windows, and other components on the basic front-end pages, the jquery plug-in is very effective, and can be rewritten and encapsulated as needed, which is simple and practical.
(8). high scalability.
Jquery provides an extension interface: jquery. Extend (object). You can add new functions to the jquery namespace. All jquery plug-ins are developed based on this extension interface.

3. Advantages and Disadvantages of jquery
(1) Advantages of jquery
<1>. jquery separates scripts from pages.
In HTML code, we often see code similar to this:
<Form ID = "myform" onsubmit = return validate (); ">
Even if the validate () function can be placed in an external file, we are still mixing pages with logic and events. Jquery allows you to separate these two parts. With jquery, the page code is as follows:
<Form ID = "myform"> next, a separate JS file contains the following event submission code:
$ ("Myform"). Submit (function (){
... Your code here
)}
In this way, we can implement clear Page code with high flexibility. Jquery separates JavaScript code from HTML page code, just as CSS separated style code from page code a few years ago.
<2>. The least Code does the most.
The least Code does the most. This is jquery's slogan and is truly worthy of the name. With its advanced selector, developers only need to write a few lines of code to achieve amazing results. Developers do not need to worry too much about browser differences. In addition to fully supporting Ajax, they also have many other abstract concepts that increase developers' programming efficiency. Jquery brings JavaScript to a higher level. The following is a simple example:
$ ("P. Neat"). addclass ("ohmy"). Show ("slow ");
With the short code above, developers can traverse all the <p> elements in the "neat" class, add the "ohmy" class to it, and slowly display each paragraph with an animation effect. Developers do not need to check the browser type of the client, do not need to write loop code, and do not need to write complex animation functions. The above results can be achieved through only one line of code.
<3>. Good performance support
In a large JavaScript framework, jquery has the best understanding of performance. Although there are many new features in different versions, the most simplified version is only 18 KB, which is hard to reduce. Each version of jquery has a significant performance improvement. If you use it with a new generation of browsers with faster Javascript Engines (such as Firefox 3 and Google Chrome), developers will have a new speed advantage in creating rich web applications.
<4>. It is a "standard"
Quotes are used because jquery is not an official standard. However, jquery is widely supported in the industry. Google not only uses it but also provides it to users. In addition, Dell, news aggregation website Digg, WordPress, Mozilla and many other vendors are also using it. Microsoft even integrated it into Visual Studio. So many heavyweight manufacturers support this framework that users can rest assured of their future and boldly invest time in it.
<5>. Plug-ins released
Jquery-based plug-ins already have thousands or so. Developers can use plug-ins to perform tasks such as Form validation, chart types, field prompts, animations, and progress bars. Jquery Community It has grown into an ecosystem. This further proves the previous reason that it is a safe choice. In addition, jquery is actively cooperating with "competitors", such as prototype. They seem to be promoting the overall development of JavaScript, not just trying to gain one's own private.
<6>. Saving learning costs
Of course, to really learn jquery, developers still need to spend a little time, especially if they want to write a lot of code or self-built plug-ins. However, developers can "break through each other", and jquery provides a lot of sample code. Getting Started is very easy. It is recommended that developers first check whether there are similar plug-ins before writing certain types of code, and then check the actual plug-in code to understand how it works. In short, to learn jquery, developers can quickly start development without having to invest too much, and then gradually improve their skills.
<7>. Make JS programming interesting
It is fun to use jquery. It is concise and powerful, allowing developers to quickly get what they want. It solves many JavaScript problems and problems. Through some basic improvements, developers can really think about developing the next generation of Web applications without worrying about poor languages or tools. Believe in its "the least code to do the most things.

(2) Shortcomings of jquery
<1>. Backward compatibility.
Each new version is not compatible with earlier versions. For example, some new versions do not support some selectors, but jquery does not retain their support, but simply remove them. This may affect the code or plug-ins that have been compiled by developers.
<2>. Plug-in compatibility.
Similar to the previous version, when the new version of jquery is released, if developers want to upgrade it, it depends on whether the plug-in author supports it. In general, the current plug-in may not work properly in the latest jquery version. The more plug-ins developers use, the higher the chance of such a situation. I once had to manually modify a third-party plug-in to upgrade to jquery 1.3.
<3>. Multiple plug-ins conflict.
When multiple plug-ins are used on the same page, it is easy to encounter conflicts, especially when these plug-ins depend on the same event or selector. Although this is not a problem of jquery itself, it is indeed a problem that is difficult to debug and solve.
<4>. jquery stability.
JqueryThis does not cause the browser to crash. This refers to its version release policy. In just a few days after the release of jquery 1.3, a vulnerability correction Version 1.3.1 was released. They also removed support for some features, which may affect the normal operation of many codes. I hope that similar changes will not appear again.
<5>. Poor Support for animations and special effects.
In large frameworks, jquery's core code library provides relatively poor support for animation and special effects. But in fact this is not a problem. There is a separate jquery UI project and many plug-ins to make up for this.

4. jquery usage
(1). jquery Selector
The basic design and usage of jquery, a webpage element, is "select a webpage element and perform some operations on it ". This is the fundamental feature that distinguishes it from other function libraries.
The first step of using jquery is to put a selection expression into the constructor jquery () (abbreviated as $) and then get the selected element.
(2). Change the result set
If multiple elements are selected, jquery provides a filter to narrow down the result set. In some cases, we need to start from the result set and move it to a nearby element, jquery also provides the moving method on the DOM tree.
(3). chained operation
After you select a webpage element, you can perform some operations on it. Jquery allows all operations to be connected and written in a chain.
This is jquery's most commendable and convenient feature. The principle is that each step of jquery operations returns a jquery object, so different operations can be connected together.
(4). Operation of elements: value and value assignment
The most common requirement for webpage elements is to obtain their values or assign values to them.
Jquery uses the same function to complete values (getter) and values (setter ). Whether it is a value or a value is determined by the function parameters.
Note that if the result set contains multiple elements, all the elements in the result set are assigned values, only the value of the first element (. with the exception of text (), It extracts the text content of all elements ).
(5). Operation of elements: Move
There are two methods to move the selected element: one is to move the element directly, and the other is to move other elements so that the target element can reach the desired position.
(6) operations on elements: copying, deleting, and creating
Use. Clone () to copy elements ().
Use. Remove () and. Detach () to delete elements (). The difference between the two lies in that the former does not retain the event of the deleted element, and the latter retains it, which is useful for re-inserting documents.
Use. Empty () to clear the element content (but not delete it ().
(7). Tool Methods
In addition to operations on selected elements, jquery also provides some tool methods (utility) that can be directly used without selecting elements.
If you understand the inheritance principle of the Javascript language, you can understand the essence of the tool method. It is a method defined on the jquery constructor, that is, jquery. Method (), so it can be used directly. The methods for operating elements are defined on the prototype object of the constructor, that is, jquery. Prototype. Method (). Therefore, instances (I .e. selected elements) must be generated for use. If you don't understand the difference, there is no problem. You just need to understand the tool method as a method that can be directly used just like a javascript native function.
(8). Event operations
Jquery can bind events to webpage elements. Run corresponding functions based on different events.
(9). Special Effects
Jquery allows objects to render some special animated effects.
For more information about how to use jquery, see chenfengtao's jquery usage blog.

 

Refer to blog:
Jquery features
Jquery usage
Jquery getting objects
Jquery Advantages and Disadvantages Analysis description