14 useful jquery tips for sharing _jquery

1. Return jquery object instance by method

with var Somediv = $ (' #someDiv '). Hide ();  instead of var Somediv = $ (' #someDiv '); Somediv.hide ();

2. Use Find to locate

Use $ (' #someDiv '). Find (' P.someclass '). Hide (); Instead of $ (' #someDiv p.someclass '). Hide (); Because you can not fire the jquery sizzle engine, while writing the selector, try to keep your selector simple while optimizing the rightmost selector.

3. Do not misuse $ (this)

Use $ (' #someAnchor '). Click (function () {alert (this.id); }); Instead of $ (' #someAnchor '). Click (function () {Alert ($ (this). attr (' id '));

4.ready in shorthand form

With $ (function () {}); Instead of $ (document). Ready (function () {});

5. Keep your code safe

Method 1 (using noconflict)

Copy Code code as follows:

var j = jquery.noconflict ();
J (' #someDiv '). Hide ();
The line below would reference some other library ' s $ function.
$ (' Somediv '). style.display = ' None ';

Method 2 (incoming parameter jquery)

Copy Code code as follows:

(function ($) {
Within This function, $ would always refer to JQuery
}) (JQuery);

Method 3 (via Ready method)

Copy Code code as follows:

JQuery (document). Ready (function ($) {
$ refers to JQuery
});

6. Simplify code

Use each instead of for, and use the array to save the temporary variable, using the document fragment, which actually has to be noted for writing native JavaScript.

7. How to use Ajax

jquery provides a useful Ajax approach to get Getjson post Ajax

8. Access to native properties and methods
For example, the method for getting an element ID is

Copy Code code as follows:

OPTION 1–use JQuery
var id = $ (' #someAnchor '). attr (' id ');
OPTION 2–access the DOM element
var id = $ (' #someAnchor ') [0].id;
OPTION 3–use JQuery ' s Get method
var id = $ (' #someAnchor '). Get (0). ID;
OPTION 3b–don ' t pass a index to get
Anchorsarray = $ ('. Someanchors '). get ();
var thirdid = anchorsarray[2].id;

9. Use PHP to check AJAX requests

By using Xhr.setrequestheader ("X-requested-with", "XMLHttpRequest"); The server side, such as PHP, can be

Copy Code code as follows:

function Isxhr () {
Return $_server[' http_x_requested_with '] = = = ' XMLHttpRequest ';
}

To check for Ajax requests that might be used in some cases where JavaScript is disabled

The relationship between 10.Jquery and $

At the bottom of the jquery code, you can see the following code
Window.jquery = window.$ = JQuery; $ is actually a shortcut of jquery.

11. Conditional Loading jquery

Copy Code code as follows:

<!–grab Google CDN jQuery. Fall back to local if necessary–>
<script src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" ></script>
<script>!window.jquery && document.write (' <script src= js/jquery-1.4.2.min.js ' ><\/script > ') </script>

If the CDN is not downloaded to jquery, it is read locally

12.Jquery Filters

Copy Code code as follows:

<script>
$ (' P:first '). Data (' info ', ' value '); Populates $ ' s data object to have something to work with
$.extend (
jquery.expr[":"], {
Block:function (elem) {
return $ (elem). CSS ("display") = = "Block";
},
Hasdata:function (elem) {
Return!$.isemptyobject ($ (elem). data ());
}
}
);
$ ("P:hasdata"). Text ("has data"); Grabs paras that have data attached
$ ("P:block"). Text ("are block level"); Grabs only paragraphs which have a display of "block"
</script>

Note: $.expr[":" is equivalent to $.expr.filters

13.hover method

Copy Code code as follows:

$ (' #someElement '). Hover (function () {
Here you can use the toggle method to achieve the effect of slipping and slipping
});

14. Incoming Property Object

When an element is created, Jquery1.4 can pass in a Property object

Copy Code code as follows:

$ (' </a> ', {
ID: ' Someid ',
ClassName: ' SomeClass ',
HREF: ' somepath.html '
});

Even jquery. Specified properties or events such as text, click