|
$號是jQuery“類”的一個別稱，$()構(gòu)造了一個jQuery對象。所以，“$()”可以叫做jQuery的構(gòu)造函數(shù)（個人觀點，呵呵！）。
1、$()可以是$(expresion)，即css選擇器、Xpath或html元素，也就是通過上述表達式來匹配目標元素。
比如：$("a")構(gòu)造的這個對象，是用CSS選擇器構(gòu)建了一個jQuery對象——它選擇了所有的<a/>這個標簽。如： $("a").click(function(){...}) 就是在點擊頁面上的任何一個鏈接時的觸發(fā)事件。確切地說，就是jQuery用<a/>這個標簽構(gòu)建了一個對象$("a")，函數(shù) click()是這個jQuery對象的一個（事件）方法。 復(fù)制代碼
代碼如下:
<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”這樣一個查詢表達式構(gòu)建了一個jQuery對象，然后的“html()”意思是顯示其html內(nèi)容，也就是上面HTML代碼段的[two]。再如： $("<div><p>Hello</p></div>").appendTo("body"); $()中的是一個字符串，用這樣一段字串構(gòu)建了jQuery對象，然后向<body/>中添加這一字串。 2、$()可以是$(element)，即一個特定的DOM元素。如常用的DOM對象有document、location、form等。如這樣一行代碼： $(document).find("div>p").html()); $()中的document是一個DOM元素，即在全文尋找?guī)?lt;p>的<div>元素，并顯示<p>中的內(nèi)容。 3、$()可以是$(function)，即一個函數(shù)，它是$(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')是有區(qū)別的， $('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')是有區(qū)別的， $('div>ul')是<div>的直接后代里找<ul>；而$('div ul')是在<div>的所有后代里找<ul>。 所以，$('#sId>li')所選擇的是id為"sId"的所有<li>孩子節(jié)點，即使這個<li>的后代還有<li>也不是它所找的范圍（所找到的DOM對象，只是它本級的DOM對象。）。而$('#sId li:not(.horizontal)')，就是指類名"sId"里面的所有l(wèi)i的子孫中沒有horizontal類的所有元素。——這里的not()是一個negation pseudo class. 這里返回的是一個jQurey對象，一個數(shù)組對象，這個jQuery對象的長度可用.length()得到。 2、XPath選擇器 如：選擇所有帶有title 屬性的鏈接，我們會這樣寫：$('a[@title]') []里帶@，說明[]里的是元素的屬性；是個屬性選擇器 []里沒@，說明[]里的是元素的子孫。 $('ul li')和$('ul[li]')雖然返回的都是一個jQuery數(shù)組，但兩者的含義正好相反。前者是要找<ul>下所有<li>子孫，而后者卻是在找所有子孫為<li>的<ul>數(shù)組。 在XPath中，要找一個“以...開頭”的屬性，用^=，如找一個name屬性是以mail開頭的input元素，就用 $('input[@name^="mail"]') 要找一個“以...結(jié)尾”的屬性，要用$= 要找一個“不頭不尾”的屬性，用*= 3、不屬于上述的CSS和XPath的選擇器，就是自定義的選擇器了，用“:”表示，這里要用的就是:first，:last，:parent ，:hidden，:visible，:odd，:even，:not('xxx')， ":eq(0)"（始于0)，:nth(n），:gt(0)，:lt(0)，:contains("xxx") 如：$('tr:not([th]):even')意為<tr>元素的子孫中不含<th>的所有子孫的偶數(shù)項 4、還有幾個，簡單不解釋了 $('th').parent()—— $('td:contains("Henry")').prev()——內(nèi)容包含有"Henry"的<td>的上一個節(jié)點 $('td:contains("Henry")').next()——內(nèi)容包含有"Henry"的<td>的下一個節(jié)點 $('td:contains("Henry")').siblings()——內(nèi)容包含有"Henry"的<td>的所有兄弟節(jié)點 還有一個，就是end()，這個方法肯定是用在某個DOM節(jié)點執(zhí)行了某一動作之后，還想在與其相關(guān)的節(jié)點上執(zhí)行類似動作，這里就要用到end()。用過end()方法之后，所返回的是執(zhí)行動作的那個節(jié)點的父節(jié)點上。舉個例子 $(...).parent().find(...).addClass().end() 這里執(zhí)行動作的節(jié)點是find(...)，是一個數(shù)組對象，它所做的動作是“addClass()”，之后，用了個end()，這時所返回的東東就是指向了parent()所指向的節(jié)點，也就是執(zhí)行“addClass()”動作的那個數(shù)組對象的父節(jié)點。 5、要直接訪問DOM元素，可用get(0)的方法，如 $('#myelement').get(0)，也可縮寫成$('#myelement')[0] |
|
|
來自： 昵稱10504424 > 《工作》
