abstrait:jQuery獲取/操作CSS的方法改變單個css屬性$('選擇器').css('屬性名稱','屬性值')---$('body').css('background-color','#ccc')---駝峰寫法效果一樣---$('body').css('backgroundColor&
jQuery獲取/操作CSS的方法
改變單個css屬性
$('選擇器').css('屬性名稱','屬性值')
---$('body').css('background-color','#ccc')
---駝峰寫法效果一樣
---$('body').css('backgroundColor','#ccc')
--------------------------------------------------------------------------------------------------------------------
改變多個css屬性
$('選擇器').css({'屬性名稱1':'屬性值1','屬性名稱2':'屬性值2','屬性名稱3':'屬性值3'})
$('p').css({'color':'red','fontSize':'40px;','fontWeight':'bold'})
--------------------------------------------------------------------------------------------------------------------
獲取單個css屬性值
$('選擇器').css('屬性名')
$('div').css('width')
--------------------------------------------------------------------------------------------------------------------
獲取多個css屬性值
$('選擇器1,選擇器2,選擇器3').css('屬性名')
--------------------------------------------------------------------------------------------------------------------
jQuery操作屬性的方法
$('選擇器').addClass('類名 類名') 該方法向被選中的元素添加一個或多個類
$('選擇器').removeClass('類名 類名') 該方法向被選中的元素移除一個或多個類
$('選擇器').attr('屬性名') 該方法設置或返回被選中元素的屬性值
$('選擇器').attr('屬性名','屬性值')
$('選擇器').removeAttr('屬性名') 該方法從被選中的元素中移除屬性
$('選擇器').hasClass('屬性值') 該方法檢查被選中的元素是否包含指定的class,是為true,否為false
$('選擇器1,選擇器2,選擇器3').toggleClass('類名') 該方法對被選中元素進行添加/刪除類的切換操作
--------------------------------------------------------------------------------------------------------------------
設置內(nèi)容:
該方法返回或者設置被選中的元素的文本內(nèi)容
$('選擇器').text() 返回
$('選擇器').text('設置的內(nèi)容') 設置
該方法返回或者設置被選中的元素的內(nèi)容(類似innerHTML可以包括html標簽)
$('選擇器').html() 返回內(nèi)容
$('選擇器').html('<h1>標簽內(nèi)容</h1>') 設置成其他標簽
該方法返回或者設置被選元素的值
$('選擇器').val() 返回內(nèi)容
$('選擇器').val('修改內(nèi)容') 設置成其內(nèi)容
--------------------------------------------------------------------------------------------------------------------
jQuery的事件函數(shù)
jQuery的事件方法
ready() 當我們的DOM已經(jīng)加載,頁面已經(jīng)加載完,觸發(fā)的事件==js的onload
語法:
$(document).ready(function(){
})
*不能與<body onload="">一起使用
blur() 當元素失去焦點 ==onblur
語法:
$('選擇器').blur(函數(shù)(){
})
focus() 當元素獲得焦點 ==onfocus
語法:
$('選擇器').focus(函數(shù)(){
})
change() 當元素值發(fā)生改變的時候
語法:
$('選擇器').change(函數(shù)(){
})
click() 點擊事件
語法:
$('選擇器').click(函數(shù)(){
})
dblclick() 雙擊事件
語法:
$('選擇器').dblclick(函數(shù)(){
})
mouseover() 當鼠標指針位于元素上方時會發(fā)生mouseover事件
語法:
$('選擇器').mouseover(函數(shù)(){
})
mouseenter() 當鼠標指針穿過元素時會發(fā)生mouseenter事件,感覺和上面的事件差不多效果
語法:
$('選擇器').mouseenter(函數(shù)(){
})
mousemove() 當鼠標指針在指定的元素中移動時,就會發(fā)生該事件,同上兩個效果差不多
語法:
$('選擇器').mousemove(函數(shù)(){
})
mouseleave() 當鼠標指針離開元素時
語法:
$('選擇器').mouseleave(函數(shù)(){
})
mouseout() 當鼠標指針從元素上移開時
語法:
$('選擇器').mouseout(函數(shù)(){
})
mousedown() 當鼠標指針移動到元素上方并按下鼠標按鍵時
語法:
$('選擇器').mousedown(函數(shù)(){
})
mouseup() 當在元素上松開鼠標按鍵時
語法:
$('選擇器').mouseup(函數(shù)(){
})
resize() 當調(diào)整當前瀏覽器窗口大小時
語法:
$(window).resize(函數(shù)(){
})
pageX() 屬性是鼠標指針的位置,相對于文檔的左邊緣 event.pageX event:必須 參數(shù)來自事件綁定函數(shù)
pageY() 屬性是鼠標指針的位置,相對于文檔的上邊緣 event.pageY event:必須 參數(shù)來自事件綁定函數(shù)
jQuery的事件切換
hover(over,out)
over:鼠標移上元素上要觸發(fā)的一個函數(shù)
out:鼠標移出元素上要觸發(fā)的一個函數(shù)
語法:
$('選擇器').hover(函數(shù)(){
},函數(shù)(){
})
toggle() 如果元素是可見的,就切換為隱藏,否則相反
Professeur correcteur:天蓬老師Temps de correction:2019-04-12 09:22:09
Résumé du professeur:這類互斥的切換操作, 應該場景很多的, 之前要通過一些函數(shù)來進行, 現(xiàn)在只需要一個方法就可以了, 的確方便多了