了解了这些才能开始发挥jQuery的威力

2020-05-23 06:15:57易采站长站整理

$( “p” ).removeClass( “myClass yourClass” );
$( “li:last” ).removeClass(function() {
  return $( this ).prev().attr( “class” );
});


.toggleClass(className) /.toggleClass(className,switch) /  .toggleClass([switch]) / .toggleClass( function(index, class, switch) [, switch ] ) toggle是切换的意思,方法用于切换,switch是个bool类型值,这个看例子就明白


Add or remove one or more classes from each element in the set of matched elements, depending on either the class’s presence or the value of the switch argument.


<div class=”tumble”>Some text.</div>


第一次执行

$( “div.tumble” ).toggleClass( “bounce” )
<div class=”tumble bounce”>Some text.</div>

第二次执行



$( “div.tumble” ).toggleClass( “bounce” )
<div class=”tumble”>Some text.</div>



$( “#foo” ).toggleClass( className, addOrRemove );


// 两种写法意思一样


if ( addOrRemove ) {
  $( “#foo” ).addClass( className );
} else {
  $( “#foo” ).removeClass( className );
}



$( “div.foo” ).toggleClass(function() {
  if ( $( this ).parent().is( “.bar” ) ) {
    return “happy”;
  } else {
    return “sad”;
  }
});


.css(propertyName) / .css(propertyNames) 获取元素style特定property的值


Get the value of style properties for the first element in the set of matched elements.



var color = $( this ).css( “background-color” );


 var styleProps = $( this ).css([
    “width”, “height”, “color”, “background-color”
  ]);


.css(propertyName,value) / .css( propertyName, function(index, value) ) / .css( propertiesJson ) 设置元素style特定property的值


Set one or more CSS properties for the set of matched elements.



$( “div.example” ).css( “width”, function( index ) {
  return index * 50;
});


$( this ).css( “width”, “+=200” );



$( this ).css( “background-color”, “yellow” );


   $( this ).css({
      “background-color”: “yellow”,
      “font-weight”: “bolder”
    });


事件方法


.bind( eventType [, eventData ], handler(eventObject) ) 绑定事件处理程序,这个经常用,不多解释