Learn jQuery skills to improve your code _ jquery

JQuery is so popular and widely used by almost everyone from large companies to personal blogs, because it is quite simple to get started and use, it also provides us with some amazing features that people don't know.

JQuery is so popular and widely used by almost everyone from large companies to personal blogs, because it is quite simple to get started and use, it also provides us with some amazing features that people don't know. I think most jQuery users tend to use jQuery plug-ins to solve their problems, which is usually a wise choice. However, when the plug-in has some defects over your needs, you may want to solve it by yourself. Let's take a look at these practical jQuery skills, they will certainly be useful!

1. Test and improve your jQuery selector level

This jQuery selector lab is very cool and can be used online for free. Of course, you can also use it offline locally. This test page contains complex HTML combination fields, and then you can try to use various jQuery selectors predefined. If this is not enough, you can also customize the selector.

2. test whether the jQuery package set contains certain elements.

If you want to test whether a jQuery packaging set contains certain elements, You can first verify whether the first element exists:

If ($ (Selector )[ 0 ]) {...}
// Or
If ($ (Selector). length ){...}

Let's take a look at this example:

// Example. If your page has the following html code
< Ul id = " Shopping_cart_items " >
< Li >
< Input class = " In_stock " Name = " Item " Type = " Radio " Value = " Item-X " / > Item X
< / Li>
< Li >
< Input class = " Unknown " Name = " Item " Type = " Radio " Value = " Item-Y " / > Item Y
< / Li>
< Li >
< Input class = " In_stock " Name = " Item " Type = " Radio " Value = " Item-Z " / > Item Z
< / Li>
< / Ul>
< Pre escaped = " True " Lang = " Javascript " > ...
// This if condition returns true because we have two The input field matches the selector, so The code will be executed
If ($ ( ' # Shopping_cart_items input. in_stock ' )[ 0 ]) { < Statement > }3. Read the latest jQuery version from jquery.org

You can use this code to read the code file of the latest jQuery version.

< Script Src = "Http://code.jquery.com/jquery-latest.js? 6.1.3" > Script>

You can use this method to call the latest version of jQuery framework. Of course, you can also use the following code to call the same latest version of jQuery from ajax.googleapis.com:

<ScriptSrc= "Http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js? 6.1.3"Type= "Text/javascript"> Script>4. Store Data

Using the data method can avoid storing data in the DOM. Some front-end developers prefer to use HTML attributes to store data:

$ ('Selector'). Attr ('Alt','Data being stored');
//Then you can read the data as follows:
$ ('Selector'). Attr ('Alt');

Using the "alt" attribute to store data as a parameter name is not semantic for HTML. We can use jQuery's data method to store data for an element on the page:

$ ('Selector'). Data ('Parameter Name','Data to be stored');
//Then the data is obtained as follows:
$ ('Selector'). Data ('Parameters');

This data method allows you to clearly define data parameters and make the semantics more flexible. You can store data information on any element on the page. If you want to know