1。優化性能複雜的選擇
查詢DOM中的一個子集，使用複雜的選擇時，大幅提升了性能：
var subset = $("");
$("input[value^='']", subset);
2。設置上下文和提升性能
jQuery核心功能上，指定上下文參數。指定context參數，容許從DOM中更深的分支，而不是從DOM根，jQuery來啓動。鑑於一個足夠大的DOM，指定上下文參數轉化爲性能提高。
$("input:radio", document.forms[0]);
3。現場事件處理程序
設置任何一個選擇的元素相匹配的事件處理程序，即便它被添加後的初始頁面加載到DOM：
$('button.someClass').live('click', someFunction);
這容許你經過Ajax加載內容，或經過JavaScript添加事件處理程序的成立爲這些元素正確自動。
一樣，要中止現場事件處理：
4。檢查索引
jQuery有索引，但它是一種痛苦，使用你所須要的元素的列表，並經過元素你想要的指標
var index = e.g $('#ul>li').index( liDomObject );
如下是比較容易：
$("ul > li").click(function ()
{
var index = $(this).prevAll().length;
});
若是你想知道在一個集合元素的索引，例如在一個無序列表的列表項：
5。使用jQuery的數據的方法
jQuery的數據（）方法是有用的，不爲人所熟知。它可讓你無需修改DOM綁定數據到DOM元素。
$("ul > li").click(function ()
{
var index = $(this).prevAll().length;
});
6。刪除一個元素的淡出效果基本show效果
結合多個jQuery效果，動畫和刪除DOM元素。
$("#myButton").click(function() {
$("#myDiv").fadeTo("slow", 0.01, function(){ //fade
$(this).slideUp("slow", function() { //slide up
$(this).remove(); //then remove from the DOM
});
});
});
7。檢查是否存在一個元素
if ($("#someDiv").length) {
//hooray!!! it exists...
}
使用下面的代碼片斷來檢查一個元素是否存在與否。
8。添加到DOM中動態建立的元素
使用下面的代碼片斷來動態建立一個DIV，並添加到DOM。
var newDiv = $('<div></div>');
newDiv.attr("id","myNewDiv").appendTo("body");
9。換行符和chainability的
而不是作：
$("a").hide().addClass().fadeIn().hide();
像這樣能夠增長可讀性：
$("a")
.hide()
.addClass()
.fadeIn()
.hide();
10。建立自定義選擇
$.extend($.expr[':'], {
over100pixels: function(a) {
return $(a).height() > 100;
}
});
$('.box:over100pixels').click(function() {
alert('The element you clicked is over 100 pixels high');
});
11。克隆在jQuery對象
使用clone（）方法。jQuery的方法克隆任何JavaScript中的DOM對象。
// Clone the DIV
var cloned = $('#somediv').clone();
jQuery的clone（）方法不克隆一個JavaScript對象。克隆JavaScript對象，使用下面的代碼。
// Shallow copy
var newObject = jQuery.extend({}, oldObject);
// Deep copy
var newObject = jQuery.extend(true, {}, oldObject);
12。測試，若是事情是隱藏使用jQuery
咱們使用。隱藏（）。在jQuery的show（）方法來改變元素的知名度。使用如下代碼來檢查一個元素是不是可見或不可見。
if($(element).is(":visible") == "true") {
//The element is Visible
}
13。另外一種方式的文件準備就緒
//Instead of
$(document).ready(function() {
//document ready
});
//Use
$(function(){
//document ready
});
14。選擇一個元素。（期），在它的ID
在選擇使用反斜槓來選擇的元素，在它的ID期間。
$("#Address\\.Street").text("Enter this field");
15。計數的直接子元素
若是你要計算全部的div＃foo的元素存在於
<div id="foo">
<div id="bar"></div>
<div id="baz">
<div id="biz">
</div>
<span><span>
</div>
//jQuery code to count child elements
$("#foo > div").size()
16。作一個「閃存」的元素
jQuery.fn.flash = function( color, duration )
{
var current = this.css( 'color' );
this.animate( { color: 'rgb(' + color + ')' }, duration / 2 );
this.animate( { color: current }, duration / 2 );
}
//Then use the above function as:
$( '#importantElement' ).flash( '255,0,0', 1000 );
17。中心元素在屏幕上
jQuery.fn.center = function () {
this.css("position","absolute");
this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
return this;
}
//Use the above function as:
$(element).center();
18。獲取父div使用最接近
若是你想找到的包裝紙DIV元素（不論該DIV的ID），而後你會想這個jQuery選擇：
$("#searchBox").closest("div");
19。禁用右鍵單擊上下文菜單
還有許多JavaScript片斷禁用右鍵
單擊上下文菜單，但jQuery讓事情容易多了：
$(document).ready(function(){
$(document).bind("contextmenu",function(e){
return false;
});
});
20。獲取鼠標光標的X和Y軸
這個腳本會顯示X和Y值 - 鼠標指針的座標。
$().mousemove(function(e){
//display the x and y axis values inside the P element
$('p').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
});
我也封裝了一下Jquery 地址：http://www.360ui.net css
