jquery基礎教程筆記

css選擇符
$('#id > li').addClass('none'); // > 子元素
$('#id li:not(.none)').addClass('not-none'); // :not選擇符
XPath選擇符
$('a[@title]') //所有帶title屬性的鏈接
$('div[ol]') //取包含一個ol元素的所有div
^ 開始 $結尾 *任意位置
$('a[@href^="mailto:"]'.addClass('mailto');
$('a[@href$=".pdf"]'.addClass('pdflink');
$('a[@href*="mysite.com"]').addClass('mysite');
自定義選擇符
$('div.myclass:eq(1)') //從帶有myclass類的div集合中選擇第二個項
js從0開始，css從1開始
:odd奇數 :even偶數
$('tr:odd').addClass('odd'); === $('tr').filter(':odd').addClass('odd');
$('tr:even').addClass('even');
$('td:contains("Henry")').addClass('highlight');
.parent() 取父元素 .next() 取後一個元素 .siblings() 取兄弟元素 .end() 結束上一次查詢
.get(index) 取DOM元素 $('#myid').get(0) === $('#myid')[0]
事件
綁定事件：
$('#myid').bind('click',function(){}); === $('myid').click(function(){});
.toggle()單擊交替事件
兩個函數參數，函數交替執行
.toggleClass('#myclass')
如果存在(不存在)就刪除(添加)一個類
.hover()突出顯示鼠標指針下方的頁面元素
event.target保存發生事件的目標元素
event.stopPropagation()阻止事件冒泡
.preventDefault()在觸發默認操作之前終止事件
解除綁定事件
$('#myclass').unbind('click',f);
.trigger() 模擬事件的操作
$('#myclass').trigger('click'); ===$('#myclass').click();
.show() 可以指示顯示速度
slow 0.6秒 normal 0.4秒 fast 0.2秒 .show(1000) 1秒
淡入淡出
.fadeIn('slow') 逐漸增大不透明度
.faseOut() 逐漸減少不透明度
.animate創建自定義動畫
4個參數：
樣式屬性及值的映射
速度
緩動類型
回調函數
.each() 方法 類似迭代器
index屬性
.insertBefore()和.before()
將元素插入到其他元素前面
.insertAfter()和.after()
向其他元素後面插入元素
.clone()
複製元素 $('div.chapter p:eq(0)').clone().insertBefore('div.chapter');
設置參數false只複製匹配的元素，而不復制匹配的子元素
匹配元素中插入新元素
.append()
.appendTo()
.prepend()
.prependTo()
匹配的元素外部插入新元素
.wrap()
移除匹配的元素
.empty()
從文檔中移除每個匹配的元素及後代元素,但不實際刪除它們
.remove()