1.It returns the object instance by a method Jquery
With var someDiv = $ ( ''# someDiv'').hide (); place var someDiv = $ ( ''# someDiv''); someDiv.hide ();
2.Use find to locate
With $ ( ''# someDiv'').find ( ''p.someClass'').hide (); instead of $ ( ''# someDiv p.someClass'').hide (); because you can does not have to trigger Jquery of Sizzle engine, while writing selectors when you try to make a simple optimization selectors selectors while the rightmost
3.Do not abuse $ (this)
With $ ( ''# someAnchor'').click (function () {alert (this.id);}); instead of $ ( ''# someAnchor'').click (function () {alert ($ (this).attr ( ''id''));});
4.ready shorthand
With $ (function () {}); instead of $ (document).ready (function () {});
5.Make your code security
Method 1 (using noConflict)
Copy the code code is as follows:
var j = jQuery.noConflict ();
j ( ''# someDiv'').hide ();
// The line below will reference some other library''s $ function.
$ ( ''SomeDiv'').style.display = ''none'';
Method 2 (incoming parameters Jquery)
Copy the code code is as follows:
(Function ($) {
// Within this function, $ will always refer to jQuery
}) (JQuery);
Method 3 (by ready Method)
Copy the code code is as follows:
jQuery (document).ready (function ($) {
// $ refers to jQuery
});
6.Simplify the code
Instead of using for each, using the array holds temporary variables, use the document fragment, this fact and write native Javascript should be noted that the same.
7.Use Ajax way
Jquery get getJSON post ajax provides these useful ajax method
8.Native access properties and methods
Id elements such as access methods are
Copy the code code is 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 - Do not pass an index to get
anchorsArray = $ ( ''.someAnchors'').get ();
var thirdId = anchorsArray [2].id;
9.Use PHP to check the Ajax request
By using xhr.setRequestHeader ( "X-Requested-With", "XMLHttpRequest"); The PHP server may by
Copy the code code is as follows:
function isXhr () {
return $ _SERVER [ ''HTTP_X_REQUESTED_WITH''] === ''XMLHttpRequest'';
}
Ajax is not a request to check, may be useful in the case of some of Javascript disabled
10.And $ Jquery relationship of
In the lowermost Jquery code, the code can be seen below
window.jQuery = window.$ = JQuery; $ is actually a shortcut Jquery
11.Jquery load conditions
Copy the code code is as follows:
'')
If not downloaded to CDN Jquery, read from the local
12.Jquery Filters
Copy the code code is as follows:
$ ( ''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 that have a display of "block"
Note: $.expr [ ":"] is equivalent to $.expr.filters
13.hover method
Copy the code code is as follows:
$ ( ''# SomeElement'').hover (function () {
// Here you can use the toggle methods to achieve the effect of slip in and out
});
14.Incoming properties of the object
When creating an element of time, Jquery1.4 can pass a property of an object
Copy the code code is as follows:
$('''', {
id: ''someId'',
className: ''someClass'',
href: ''somePath.html ''
});
Even Jquery specified property or event, such as text, click
You may also be interested in the article: jQuery techniques Daquan (Primer for beginners) jQuery write some tips widget jquery common share tips and a list of commonly used methods to understand jQuery collection of tips to improve your code (jquery personally feel that the manual is very good) jquery div centering technique application introduction jQuery common development techniques detailed finishing 12 small tips on new jQuery event binding mechanism on () the use of techniques jquery operation check box (checkbox) of jQuery operating table (table) summarizes the common methods, techniques summary 15 jquery common method of recycling techniques jQuery 4 principles to write efficient code jQuery and jQuery source code analysis techniques 5 of the Detailed, share tips daily collection of jquery skills