$(document).ready()

通常你想在DOM結構加載完畢之后才執(zhí)行相關腳本。使用原生javaScript，你可能調用window.onload = function() { ... }, 但是這個辦法的你只能夠調用一次，而且需要等DOM結構完全加載完畢，包括圖片樣式等靜態(tài)文件所有夾在完畢才會開始執(zhí)行onload函數里面的代碼。

jQuery中提供了一種更好的辦法：

$(document).ready(function() {	console.log('ready!');});

與onload函數不同的是，這個辦法可以被調用無限多次，而且不需要等待頁面元素完全下載完畢才執(zhí)行代碼，即DOM結構渲染完畢后馬上執(zhí)行代碼。

你可能見過一些經驗豐富的開發(fā)者使用下面的簡寫形式：

$(function() {	console.log('ready!');});

除了傳遞匿名函數，你也可以選擇傳遞命名函數:

function readyFn(jQuery) {	//do something...}$(document).ready(readyFn);//或者：$(window).load(readyFn);

避免與其他庫沖突

1、No-Conflict模式
jQuery庫是被包含在jQuery全局變量中的，而$是jQuery的快捷方式，也就是$默認也是全局變量。如果你在使用其他包含$全局變量的庫（如PRototype，YUI），你可能面臨變量名沖突，不過jQuery提供了避免這種沖突的辦法。

<script src="prototype.js"></script><script src="jquery.js"></script><script>var $j = jQuery.noConflict();//現在$不再是jQuery的別名，$j替換了$成為了jQuery的新別名$j(document).ready(function() {  $j('div').hide();});//現在$是prototype的別名window.onload = function() {  var mainDiv = $('main');};</script>

上面的代碼中的$會回復到它本身的庫的用途。你依然可以通過jQuery或者$j的方式使用jQuery庫。你可以隨意更改jQuery的別名， 比如`jq', '$J', 'awesomeQuery'等。

另外，如果你不想給jQuery命名新的別名（你依然想要用$），你依然有辦法可以避免沖突。

<script src="prototype.js"></script><script src="jquery.js"></script><script>jQuery.noConflict();jQuery( document ).ready(function( $ ) {   //這個作用域里的$都是jQuery的別名  $('div').hide();});//全局作用域的$是prototype的window.onload = function() {  var mainDiv = $('main');};</script>

這些技巧基本上可以完成日常需求了。

2、 引入其他庫之前引入jQuery

在其他庫前引入jQuery，你需要使用jQuery來調用jQuery庫，$別稱屬于其他庫。

<script src="jquery.js"></script><script src="prototype.js"></script>//通過jQuery全稱調用jQuery庫jQuery(document).ready(function() {  jQuery('div').hide();});//由于prototype在jQuery之后引入，$別名屬于prototypewindow.onload = function() {  var mainDiv = $('main');};

3、 總結

創(chuàng)建新別名：

jQuery.noConflict()方法做了兩件事，一是返回了jQuery對象的引用，你可以用來賦值給自定義的變量，如（$jq）；二是，刪除了默認的$別稱，把$別名歸還給其他庫：

<script src="prototype.js"></script><script src="jquery.js"></script><script>  //將$別名歸還prototype，創(chuàng)建一個新的別名$jq  var $jq = jQuery.noConflict();</script>

使用立即調用函數表達式:

你可以創(chuàng)建一個立即調用函數表達式，然后在表達式里使用$作為jQuery的別名：

<script src="prototype.js"></script><script src="jquery.js"></script><script>  jQuery.noConflict();  (function( $ ) {    $('div').remove();  })( jQuery );</script>

注意，如果你使用這個技巧，你將不能夠在立即調用函數表達式里面使用$作為prototype的別名。

給jQuery(document).ready()傳遞參數：

<script src="jquery.js"></script><script src="prototype.js"></script><script>  jQuery(document).ready(function( $ ) {    //do something...  });</script>

或者

<script src="jquery.js"></script><script src="prototype.js"></script><script>  jQuery(function( $ ) {    //do something...  });</script>