Javascript - Jquery - 常用方法
常用方法（Common Method）
類名
方法
addClass(className)
className是css類名，為該對象指定或增加一個類名，返回該對象。
removeClass(className)
className是css類名，移除參數指定的類名，返回該對象。
hasClass(className)
className是css類名，測試該對象是否含有參數指定的類名。
toggleClass(className)
className是css類名，該對象的類名在原來的類名與參數指定的類名之間切換，一般用在事件裏。
//事件每觸發一次，span的類名就會在spanColor和spanRelColor之間切換
表單
方法
val(x)
x是可選的值，獲取或設置該對象的值，此方法用於獲取或設置輸入框、下拉列表、單選多選框的值。
距離
屬性
pageY
鼠標對象的屬性 獲取鼠標離客戶區頂部的高度。
pageX
鼠標對象的屬性 獲取鼠標離客戶區左邊的長度。
方法
offset
返回一個對象，包含了left和top屬性，分別表示該對象離客戶區的左邊距和頂邊距
$(‘div‘).offset( ).left
height
獲取對象的高度。
innerHeight
獲取對象的高度＋補白。
outerHeight(x)
獲取對象的高度＋補白＋邊框。默認x=false，x=true時，獲取對象的高度＋補白＋邊框＋邊距。
scrollTop(x)
x是可選的表示距離的值，設置或獲取出現滾動條的JQuery對象其滾動條從該對象頂部開始位置滾動了多少距離。
scrollLeft(x)
x是可選的表示距離的值，設置或獲取出現滾動條的JQuery對象其滾動條從該對象左部開始位置滾動了多少距離。
position
返回一個對象，該對象包含了left和top屬性，分別表示該對象離其父元素的左邊距和頂邊距。
樣式
方法
css (x)
x是匿名對象，指定了css屬性名與值的鍵值對，設置或獲取該對象的css樣式。
height(x)
設置或獲取該對象的高度，獲取的值不包括padding和border。x可以是高度值或匿名函數，匿名函數內部會自動生成兩個參數index（該DOM對象在JQuery數組對象中的索引）和height。
width(x)
設置或獲取該對象的寬度，獲取的值不包括padding和border。x可以是高度值或匿名函數，匿名函數內部會自動生成兩個參數index（該DOM對象在JQuery數組對象中的索引）和width。
innerHeight
獲取該對象的內部高度，即不包括border的值，但包括padding的值。
innerWidth
獲取該對象的內部寬度，即不包括border的值 但包括padding的值。
outerHeight(x)
獲取第一個匹配元素的外部高度，包括border、padding。x是可選的布爾值，如果為true，獲取會包括margin。
outerWidth(x)
獲取第一個匹配元素的外部寬度，包括border、padding。x是可選的布爾值，如果為true，獲取會包括margin。
節點
創建節點
$(htmlCode)
htmlCode是節點的html代碼，節點必須小寫，創建一個節點並將其包裝為JQuery對象返回。
$(document).ready(function () {
var html = "<div>hello</div>";//創建元素節點和文本節點
html += "<p/>";//單閉合節點可以寫成<p/>或<p></p>
var div = $(html);
$(document.body).append(div)//插入body裏
var div = $("<div id=‘box‘ style=‘width:200px;background:red‘>hello</div>")
})
方法
獲取
parent
獲取該對象的父節點。
parents(x)
x是選擇器，獲取該對象的由x指定的祖先節點。
$("div").parents(".box")
attr(x,y)
x是屬性名，y是可選的屬性值，獲取或設置該對象的屬性值。
//使用匿名對象來同時設置多個屬性
var JQueryObj = $(‘span‘);
JQueryObj.attr ( { ‘title‘ : ‘spanBox‘ , ‘class‘ : ‘spanBox‘ } );
children (x ,y)
x是可選的子元素html標簽名，y是可選的JQuery選擇器。獲取該對象全部的子節點或只獲取參數指定的節點，返回一個JQuery對象。
var tr = $("#tr");
tr.children("td:eq(1)") //獲取該tr的索引為1的td節點
next
獲取緊靠該對象的下一個兄弟節點。
nextAll (x)
x是選擇器，獲取該對象後邊的所有兄弟節點或x指定的節點。
$("#box").nextAll("a[id=10]")//選擇ID為box的節點，然後選擇它的兄弟節點，該兄弟節點的id=10
nextUntil(x)
x是選擇器，獲取該對象後邊的每一個兄弟節點，直到遇到選擇器給出的節點時停止（不包括選擇器給出的節點）。
<body>
<div id="box"></div>
<div></div>
<div></div>
<div></div>
<div id="4"></div>
<script>
$(document).ready(function () {
var len = $("#box").nextUntil("div[id=4]").length;
alert(len);//print 3
})
</script>
</body>
prev
獲取緊靠該對象的上一個兄弟節點。
prevAll(x)
x是選擇器，獲取該對象前邊的所有兄弟節點或x指定的節點。
prevUntil(x)
x是選擇器，獲取該對象前邊的每一個兄弟節點，直到遇到選擇器給出的節點時停止（不包括選擇器給出的節點）。
siblings(x)
x是選擇器，獲取該對象前後的所有兄弟節點。
插入
append(x)
在該對象所包含的後代節點的最後一個位置後插入x指定的節點。 x=html代碼片段，x=純文本，x=JQuery對象。
prepend(x)
將x指定的節點插入該對象所包含的後代節點的首位。x=html代碼片段，x=純文本，x=JQuery對象。
before(x)
在該對象之前插入x指定的節點。x=html代碼片段，x=純文本，x=JQuery對象。
after(x)
在該對象之後插入x指定的節點。x=html代碼片段，x=純文本，x=JQuery對象。
appendTo(x)
將該對象插入x節點所包含的末位。x=html代碼片段，x=純文本，x=JQuery對象。
<script>
$(document).ready(function () {
var div = $("<div style=‘background:red;width:100px;height:40px;‘></div>");
var p = $("<p>test</p>");
p.appendTo(div);
div.appendTo(document.body);
})
</script>
prependTo(x)
將該對象插入x節點所包含的首位。x=html代碼片段，x=純文本，x=JQuery對象。
insertBefore(x)
將該對象插入x節點之前。x=html代碼片段，x=純文本，x=JQuery對象。
insertAfter(x)
將該對象插入x節點之後。x=html代碼片段，x=純文本，x=JQuery對象。
wrap(x)
將該對象分別用參數指定的節點包裹。x=html代碼片段，x=純文本，x=JQuery對象。
var JQueryObj = $(‘span‘);
JQueryObj.wrap(‘<b></b>‘);
<span>hello</span>
<span>hello</span>
<!--得到結果如下：-->
<b><span>hello</span></b>
<b><span>hello</span></b>
wrapAll(x)
將該對象用參數指定的節點包裹。x=html代碼片段，x=純文本，x=JQuery對象。
var JQueryObj = $(‘span‘);
JQueryObj.wrapAll(‘<b></b>‘);
<span>hello</span>
<span>hello</span>
<!--得到結果如下：-->
<b>
<span>hello</span>
<span>hello</span>
</b>
wrapInner(x)
將該對象所包含的文本用x指定的節點包裹起來。x=html代碼片段，x=純文本，x=JQuery對象。
var JQueryObj = $(‘span‘);
JQueryObj.wrapInner("$(‘<b></b>‘)");
<span>hello</span>
<span>hello</span>
<!--結果如下：-->
<span><b>hello</b></span>
<span><b>hello</b></span>
text(x)
x是文本，獲取該元素所包含的文本（包括後代節點的文本），如果提供了x，則用x替換該對象所包含的所有內容（包括html標簽） 並返回一個JQuery對象。
html(x)
x是html代碼，獲取該元素包含的所有後代的html）代碼和文本（不包括自身）。如果提供了x，則用x替換該對象所包含的所有內容（包括html標簽） 並返回一個JQuery對象。
查找
index(x)
x是選擇器，在該對象裏查找x過濾出的節點的索引。
var index = $(".tabMenuLinkBox li").index($("#firstLi"));
刪除
remove
刪除該對象，包括其後代節點並返回刪除的JQuery對象。
//獲取類名為fatherBox的節點，從中過濾出索引為奇數的span節點
var deleteJQueryObj = $(‘.fatherBox span:odd‘);
//刪除
deleteJQueryObj.remove();
empty
刪除該對象的所有後代節點（不包括自身）並返回刪除的JQuery對象。
removeAttr(x)
x是屬性節點，刪除該對象的屬性節點並返回刪除的JQuery對象。
替換
replaceWith(x)
將該對象替換為參數指定的節點，x=html代碼片段，x=純文本，x=JQuery對象。
replaceAll(x)
將參數指定的節點替換為該對象，x=html代碼片段，x=純文本，x=JQuery對象。
復制
clone(x)
克隆該對象，x是可選的布爾值，如果x=true，會額外克隆該對象已註冊的事件。
叠代
each(x)
x是函數，在函數裏叠代該對象。
$(document).ready(function () {
var childNodes = $(document.body).children();
childNodes.each(function () {
ADS.log.write(this.nodeName);
});
});
Javascript - Jquery - 常用方法