Home  >  Article  >  Web Front-end  >  jquery operates css selector

jquery operates css selector

黄舟
黄舟Original
2016-12-16 10:47:171117browse

.addClass()
 Adds the specified style class name to each matching element
 .addClass(className)
  className adds one or more style names to each matching element
 .addClass(function(index,currentClass) )
  The function returns one or more separated by spaces, index represents the index position in the parameter matching, and this points to the current element in the matching element set.
 $("p").addClass("myClass yourClass"); Add these two class name styles to the p element.
  $("ul li:last").addClass(function(index){
   return "item-"+index;
  }) Add the "item-1" style to the last

  • element.


    .CSS()
     Get the calculated value of the style attribute of the first element in the set of matching elements or set one or more
     css attributes of each matching element.

     .css(PRopertyName)
      propertyName is a css property name. An array of one or more css properties.
     $(this).css("background-color"); Get the background color of the current element.
     $(this).css(["width","height",color]) Get the width and height font color of the current element.

     .css(propertyName,value)
      propertyName is a css property name.
      value sets the attribute value of this css.
      .css(propertyName,function)
      propertyName is a css property name.
      function A function used to return the set value. this is the current element.

     $('div.example').css('width',function(index){
      return index*50;
     }) Set the width of a matching element to a larger value.
      $("p").mouSEOver(function(){
       $(this).css("color","red");
     }) When the mouse passes over the p element, the text turns red.
      $("#box").one("click",function(){
       $(this).css("width","+=200")
     }) Increase the width of #box to 200 pixels.


    .hasClass()
      Determine whether any matching element is assigned the given (style class)
     .hasClass(className)
      className The style name to be queried.
       $("#mydiv").hasClass("foo") Whether the matched element contains the style foo
      If it has this style, then return true. If not, then return false


    .removeClass()
      Remove the matching element The style on the element.
      .removeClass([className])
       One or more space-separated style names to remove for each matching element.
      $("p").removeClass("myClass yourClass")
      .removeClass(function(index,class))
       A function that returns one or more elements to be removed, index is the current element in the set of all matching elements Elements.


    .toggleClass()
      Toggle style name on each element in the matched element set
     .toggleClass(className)
      className One or more () used to toggle on each element in the matched element set separated by spaces) style class names.
      .toggleClass(className,switch)
      switch is a Boolean value used to determine whether the style should be added or removed.
      .toggleClass([switch])
      switch is a Boolean value used to determine whether the style class is added or removed.

      $('#foo').toggleClass(className,add0rRemove) is equivalent to
     if(add0rRemove){
      $('#foo').addClass(className);
     }else{
      $('#foo'
    })

    The above is the content of jquery operating css selector. For more related articles, please pay attention to the PHP Chinese website (www.php.cn)!


  • Statement:
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn