這篇文章跟大家介紹一下jQuery中$()函數的7種用法。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有幫助。
jQuery對像是一個類別數組的對象，含有連續的整形屬性以及一系列的jQuery方法。它把所有的操作都包裝在一個jQuery()函數中，形成了統一(也是惟一)的操作入口。
其中我們用的非常頻繁的一個函數是$()或者說是jQuery()，當我們呼叫他的時候會根據傳入的參數的不同而達到不同的效果。
簡要的說是：接收一個css選擇器表達式(selector)和可選的選擇器上下文(context),傳回一個包含了符合的DOM元素的jQuery物件。
預設情況下，對匹配元素的查找都是從根元素ducument物件開始，也就是說查找範圍是整棵文檔樹。但如果給定了上下文context，則在指定上下文中尋找
html
<span>body span</span>
<span>body span</span>
<span>body span</span>
<div class="wrap">
<span>wrap span</span>
<span>wrap span</span>
<span>wrap span</span>
</div>js
$('span').css('background-color','red');//所有的span都会变红
$('span','.wrap').css('background-color','red');//只有.wrap中的span会变红用所提供的html程式碼建立DOM元素
對於jQuery(html,ownerDocument)，參數html可以是單單>
對於jQuery(html,ownerDocument)，參數html可以是單單標籤或是多層標籤之間的嵌套。第二個參數用於建立新DOM元素的文檔對象，如果不傳入則預設為目前的文檔對象。 //单标签 两种方式都可以往body中插入div
/*
* 1 $('<div>').appendTo('body');
* 2 $('<div></div>').appendTo('body');
*/
// 多标签嵌套
$('<div><span>dfsg</span></div>').appendTo('body'); $('<div>我是div</div>',{
title:'我是新的div',
click:function(){
$(this).css('color','red');
console.log(this);
}
}).appendTo('body');如果傳入一個DOM元素或是DOM元素的數組，則把DOM元素封裝到jQuery物件中並回傳。html
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul> // 传入DOM元素
$('li').each(function(index,ele){
$(ele).on('click',function(){
$(this).css('background','red');//这里的DOM元素就是this
})
})
//传入DOM数组
var aLi=document.getElementsByTagName('li');
aLi=[].slice.call(aLi);//集合转数组
var $aLi=$(aLi);
$aLi.html('我是jQuery对象');//所有的li的内容都变成'我是jQuery对象'4 jQuery(object)
var obj={name:'谦龙'};
var $obj=$(obj);//封装成jQuery对象
//绑定自定义事件
$obj.on('say',function(){
console.log(this.name)//输出谦龙
});
$obj.trigger('say');5 jQuery(callback)
$(function(){
}) //以上代码和下面的效果是一样的
$(document).ready(function(){
...//代码
})6 jQuery(jQuery object)
var aLi=$('li');
var copyLi=$(aLi);//创建一个aLi的副本
console.log(aLi);
console.log(copyLi);
console.log(copyLi===aLi);當傳進去的參數是一個jQuery物件的時候，則建立該jQuery物件的一個副本並傳回。副本與傳入的jQuery物件引用完全相同的元素
7 jQuery()如果不傳入任何的參數，則返回一個空的jQuery對象，屬性length為0
注意這個功能可以用來復用jQuery對象，例如可以創建一個空的jQuery對象，然後在需要的時候先手動修改其中的元素，然後在呼叫jQuery方法。從而避免重複創建jQuery物件。
相關影片教學推薦：jQuery教學（影片）
