首頁  >  文章  >  web前端  >  jquery操作css選擇器

jquery操作css選擇器

黄舟
黄舟原創
2016-12-16 10:47:171117瀏覽

.addClass()
  為每個匹配的元素添加指定的樣式類別名稱
  .addClass(className)
    className 為每個匹配元素所有增加的一個或多個樣式名稱
 〔className 為每個匹配元素」所有增加的一個或多個樣式名稱
 錉. )
    函數傳回一個或多個用空格隔開, index 表示參數匹配中的索引位置this 指向匹配元素集合中的當前元素。
  $("p").addClass("myClass yourClass"); 為p 這個元素加入這兩個類別名稱樣式。
  $("ul li:last").addClass(function(index){ 
    return "item-"+index;

  }) 在最後一個
  • 元素上加上「item-1」樣式。



    .CSS()
      取得符合元素集合中的第一個元素的樣式屬性計算值或設定每一個符合元素的一個或多個

      css屬性。


      .css(PRopertyName)
        propertyName 一個css 屬性名稱 。 一個或多個css 屬性組成的陣列。
      $(this).css("background-color"); 取得目前元素的背景顏色。
      $(this).css(["width","height",color]) 取得目前元素的 寬 高 字體顏色。

      .css(propertyName,value)
        propertyName 一個css 屬性名稱。
        value 設定這個css 的屬性值。
      .css(propertyName,function)
        propertyName 一個css 屬性名。

        function 一個用來傳回設定值的函數。 this,是當前元素。


      $('div.example').css('width',function(index){ 
        return index*50;
      }) 設定一個符合元素的寬度增加到較大的值。
      $("p").mouSEOver(function(){ 
        $(this).css("color","re​​d");
      }) 當滑鼠經過p 元素時文字變成紅色。
      $("#box").one("click",function(){ 
        $(this).css("width","+=200")

      }) 增加#box 的寬度為像素的寬度。



    .hasClass()
      決定任何一個符合的元素是否有被指派給定的(樣式類別)
      .hasClass(className) 
      className 要查詢的樣式名。
      $("#mydiv").hasClass("foo") 匹配的元素是否含有foo這個樣式

      如果有這個樣式那麼就回傳true 如果沒有那麼就回傳false



    .removeClass() 如果沒有那麼就回傳false
    『元素上面的樣式。
      .removeClass([className])
        每個匹配元素移除的一個或多個用空格隔開的樣式名。
      $("p").removeClass("myClass yourClass")
      .removeClass(function(index,class))

           一個函數,傳回一個或多個要移除的元素,index 所有符合的元素集合中的當前元素,傳回一個或多個要移除的元素,index的元素。



    .toggleClass() 
      在匹配的元素集合中的每個元素上切換樣式名稱
      .toggleClass(className)
       className 在匹配的元素集合中使用多個元素的一個組合中的每個元素來切換或一個匹配的元素來切換或一個匹配的元素(每個元素上用空格隔開)樣式類別名稱。
      .toggleClass(className,switch)
        switch 一個布林值,用於判斷樣式是否應該被新增或移除。
      .toggleClass([switch])

        switch 一個用來判斷樣式類別天添加或移除的布林值。


      $('#foo').toggleClass(className,add0rRemove) 就等同於
      if(add0rRemove){ 
        ＀〵C$('coo).  $('#foo' ).removeClass(className) 
      }

      $("p").click(function(){ 

      $(this)。 })

     以上就是jquery操作css選擇器的內容,更多相關文章請關注PHP中文網(www.php.cn)! 

  • 陳述:
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn