亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

jquery改變css樣式及事件函數(shù),事件切換

Original 2019-04-20 13:21:34 546
abstrakt:一.改變css樣式  $(document).ready(function(){            改變單個(gè)css屬性            $(選擇器).css(&

一.改變css樣式

  $(document).ready(function(){
            改變單個(gè)css屬性
            $(選擇器).css('屬性名','屬性值')
            $('body').css('background-color','PLUM')
            改變多個(gè)css屬性
            $('選擇器').css({'屬性名1':'屬性值1','屬性名2','屬性值2','屬性名3','屬性值3'})
              $("p").css({'color':'red','font-size':'40px','font-weight':'bold'});
              獲取單個(gè)css的屬性值
              $('選擇器').css('屬性名')
             alert($('div').css('width'))
             alert($('div').css('height'))

二.jquery操作屬性的方法

jquery的操作屬性其原理還是對(duì)於dom的操作
通過(guò)對(duì)象的關(guān)係,對(duì)節(jié)點(diǎn)樹(shù)中的元素的屬性進(jìn)行操作的方法有以下:
addClass()該方法向被選中的元素添加一個(gè)或者多個(gè)類
removeClass()該方法從被選中的元素移除一個(gè)或者多個(gè)類
attr()該方法設(shè)置或者返回被選中元素的屬性值
removeAttr()該方法從被選中的元素中移除屬性
hasClass()該方法檢查被選中的元素是否包含指定class
toggleClass()該方法對(duì)被選中元素進(jìn)行添加/刪除類的切換操作
設(shè)置內(nèi)容:
text()該方法返回或者設(shè)置被選中的元素的文本內(nèi)容
html()該方法返回或者設(shè)置被選中的元素的內(nèi)容(類似innerHtml 可以包含HTML標(biāo)籤)
val()該方法返回或者設(shè)置被選中元素的值

ex;
$(document).ready(function(){
    $('p').addClass('box main')  //d多個(gè)類,用空格隔開(kāi)
    $('p').removeClass('box main')
     alert($('p').attr('title'))
    $('p').attr('title','你好')
alert($('p').attr('title'))
$('p').remove()
$('button').click(function(){
    $('img').removeAttr('src')
})
$('button').click(function(){
   alert($('div').hasClass('one'));
  
})
$(document).ready(function(){
$('button').click(function(){
$('span,b,p').toggleClass('bb')
alert($('p').text())
$('b').text('flow')
alert($('p').html())
$('p').html('<h1>hel</h1>')
alert($('input').val())
$('input').val('我是被修改的值')

三.jquery事件函數(shù)
1. ready()當(dāng)我們的DOM已經(jīng)加載,頁(yè)面已經(jīng)架在你玩,觸發(fā)的事件= =js的onload
語(yǔ)法:
  $(document).ready(function(){
})
備註:不能與<body onlad="">一起使用
blur()當(dāng)元素失去焦點(diǎn)= =onblur
focus()當(dāng)元素獲得焦點(diǎn)
change()當(dāng)元素的值發(fā)生改變的時(shí)候
click()點(diǎn)擊事件
dblclick()雙擊事件
mouseover()當(dāng)鼠標(biāo)指針位於元素上方時(shí)會(huì)發(fā)生mouseover事件
mouseenter()當(dāng)鼠標(biāo)指針穿過(guò)元素時(shí)會(huì)發(fā)生mouseenter事件
mousemove()當(dāng)鼠標(biāo)指針在指定的元素中移動(dòng)時(shí),就會(huì)發(fā)生該事件
mouseleave()當(dāng)鼠標(biāo)指針離開(kāi)元素時(shí)
mouseout()當(dāng)鼠標(biāo)指針從元素上移開(kāi)時(shí)
mousedown()當(dāng)鼠標(biāo)指針移動(dòng)到元素上方并按下鼠標(biāo)按鍵時(shí)
mouseup()當(dāng)再元素上鬆開(kāi)鼠標(biāo)按鍵時(shí)
resize()當(dāng)調(diào)整當(dāng)前瀏覽器窗口大小時(shí)
pagex()屬性是鼠標(biāo)指針的位置,相對(duì)於文檔的左邊緣event.pagex event:必須 參數(shù)來(lái)自事件綁定函數(shù)
pagey()屬性鼠標(biāo)指針的位置,相對(duì)於文檔的上邊緣event.pagey event:必須 參數(shù)來(lái)自事件綁定函數(shù)

ex;
  $(document).ready(function(){
      $('input').blur(function(){
          $('input').css('background','red')
      })
      $('input').focus(function(){
          $('input').css('background','green')
      })
     $('input').change(function(){
         $('input').css('background','plum')
     })
$('button').click(function(){
     $('div').css('background','yellow')
})


Korrigierender Lehrer:西門大官人Korrekturzeit:2019-04-20 13:45:21
Zusammenfassung des Lehrers:總結(jié)的不錯(cuò),很全面。不過(guò)文字怎么是繁體字呢。

Versionshinweise

Beliebte Eintr?ge