jquery用法--css操作

1、在jquery中对css的操作主要是在js中对元素进行样式的设置；

写法一:

<div>css操作</div>
$(document).ready(function(){
      $('#dvi').css('width','100px');
      $('#dvi').css('height','100px');
      $('#dvi').css('background','red');
})


这种写法如果设置的样式过多的话，有点麻烦。


写法二：
$(document).ready（function(){
$('div').css({
         width:'150px',
            height:'150px',
            backgroundColor:'#343434'
        })
}）

写法三：

为元素添加类addClass
另外建一个css文件jq.css，定义一个样式类
.style{
     width: 200px;
     height: 200px;
     background: #2d57a1;
 }

在html文件里引入该文件。

js中添加该类；

$('div').addClass('style');
或者通过 一个点击事件来触发该方法：

$('div').click(function(){
            //  $(this).addClass('style2');
           //   $(this).removeClass('style');  //也可以通过removeClass移除该类
            $(this).toggleClass('style2');    //实现div在样式1与样式2之间切换

        })