jQuery的三種$()
2024-05-06 14:12:04
供稿：網友
1、$()可以是$(expresion)，即css選擇器、Xpath或html元素，也就是通過上述表達式來匹配目標元素。
比如：$("a")構造的這個對象，是用CSS選擇器構建了一個jQuery對象——它選擇了所有的<a/>這個標簽。如：
$("a").click(function(){...})
就是在點擊頁面上的任何一個鏈接時的觸發事件。確切地說，就是jQuery用<a/>這個標簽構建了一個對象$("a")，函數 click()是這個jQuery對象的一個（事件）方法。
比如有這樣一段HTML代碼：
代碼如下:
<p>one</p>
<div>
<p>two</p>
</div>
<p>three</p>
<a href="#" id="test" onClick="jq()" >jQuery</a>
而操作這段HTML的是如下一條語句：
alert($("div>p").html());
$()中的是一個查詢表達式，也就是用“div>p”這樣一個查詢表達式構建了一個jQuery對象，然后的“html()”意思是顯示其html內容，也就是上面HTML代碼段的[two]。再如：
$("<div><p>Hello</p></div>").appendTo("body");
$()中的是一個字符串，用這樣一段字串構建了jQuery對象，然后向<body/>中添加這一字串。
2、$()可以是$(element)，即一個特定的DOM元素。如常用的DOM對象有document、location、form等。如這樣一行代碼：
$(document).find("div>p").html());
$()中的document是一個DOM元素，即在全文尋找帶<p>的<div>元素，并顯示<p>中的內容。
3、$()可以是$(function)，即一個函數，它是$(document).ready()的一個速記方式。如常見的形式是這樣的：
$(document).ready(function(){
alert("Hello world!");
});
可變形作：
$(function(){
alert("Hello world!");
});
對于選擇HTML文檔中的elements，jQuery有兩種方法：
1）如$("div>ul a")，它的意思是div標簽中的ul標簽中的a標簽
不過，$('div>ul')和$('div ul')是有區別的，
$('div>ul')是<div>的直接后代里找<ul>；
而$('div ul')是在<div>的所有后代里找<ul>。
2）用jQuery對象的幾個方法（如方法find()、each()等）
$("#orderedlist).find("li") 就像 $("#orderedlist li"). each()一樣迭代了所有的li，而表達式中的“#”表示HTML中的ID，如上例中的“#orderedlist”就表示“ID為orderedlist所在的標簽”。
****************************************************************
1、標簽選擇器$('p')、類選擇器$('.myClass')、id選擇器$('#myId')相對簡單，不多說。不過有一點——$('div>ul')和$('div ul')是有區別的，
$('div>ul')是<div>的直接后代里找<ul>；而$('div ul')是在<div>的所有后代里找<ul>。
所以，$('#sId>li')所選擇的是id為"sId"的所有<li>孩子節點，即使這個<li>的后代還有<li>也不是它所找的范圍（所找到的DOM對象，只是它本級的DOM對象。）。而$('#sId li:not(.horizontal)')，就是指類名"sId"里面的所有li的子孫中沒有horizontal類的所有元素。——這里的not()是一個negation pseudo class.
