$ = window.jQuery=jQuery;
選擇id用#
$('#id')
$('div') 直接標籤名
$('.class') .+類名
$('*') 通配符
$('a,div,.class') 多項選擇器
$('div a') 空格選擇後代
$('parent > child') 只選擇下一層的父子
$('prev + next') 選擇同一層緊接着prev的next標籤
$('prev ~ siblings') 選擇本同一層兄弟標籤,共同父親的
屬性名 比如包含屬性的lang type都會選擇出來
^= 表示以value開頭就行
$= 表示 以value結尾 和正則表達式相同
*= 表示包含 value 就行 可以匹配
[selector1][selector2][selector3] 滿足多個條件選擇
用法就是 $('#') #表示上面圖標的使用
過濾器:
$('class > p:first-child') 過濾class下第一個孩子是p標籤的孩子
nth-child(2) 表示選擇第2個孩子 不和數組的0一樣,從第一個開始
nth-last-child(2) 倒數第二個孩子
only-child 只有一個孩子
$('class:first-of-type')
$('class > p:first-of-type') 只要是第一個p標籤或者存在一個p標籤即可
而 child是子類的位置,不是存在與第幾個
其中參數
n 匹配第幾個 從1開始
odd 匹配奇數個
even 偶數
2n 偶數 2n+1 奇數 也是帶入1的座標
可以是別的特殊公式
表單相關
:input 找到表單
:text 匹配單行文本框
:enabled 可用的
:disabled 不可用的
:checked 被選中的 用於select 的option 複選 單選
:selected 所有option元素
查找
$('select').find('.javascripts'); 選擇 select的裏面的元素 包括孫子等所有後代
$('select').children('option'); 只找到孩子 不包括孩子的孩子
$('select').parent(); 找到父親 不可能有多個父親 ,不用填參數,也可以填用於判斷是否是其父親
.next()
.prev() 查找下一個 上一個
.eq(n) 數組的第幾個元素
.siblings() 找到兄弟 可以不寫
.filter('.python') 找到python類
filter可以代替上面很多方法
.click 單擊 .dbclick雙擊
mousedown mouseup 點下 鬆開
mounseenter mounseleave 進入離開
hover([over],out) 懸浮鼠標 進入時候可以省略 離開不可以
mouseover mounseout 進入 離開
mounsemove([data],fction) 移動
scroll([],fction) 滾動
鍵盤事件
keydown([[data],fction])
$(document).keydown(function(){})
$(document).keydown(function(event){}) 其中event可以有keyCode event.keyCode 可以控制效果
keyup()
keypress() 參數都一樣 按下後就發生
其他事件
ready 加載完執行
resize([[data],fnc]) 只要改變瀏覽器大小 使用window
focus 獲得焦點 blur 失去焦點
change 發生改變 比如在input 中
select 例如表單中被選擇
submit 提交表單時
以上參數都和resize一樣
事件參數
event 可以獲取很多信息
例如 event.key event.keyCode
事件綁定與取消
.on(events,[selector],[data],fction)
事件取消
off
one 綁定一次性的事件,運行完自動解綁
bug:
html與index同步 防止圖片出錯
函數值初始化
動畫