jQuery笔记，四：使用css

可以在脚本中使用.css()方法来获取或设定元素的CSS属性，但是.css()方法的缺点是它会在HTML中添加内嵌样式。因此建议改用添加或删除样式类的方式。

1、为DOM元素设定CSS属性

在调试布局时，.css()方法非常有用。

<script type="text/javascript">
  
          $(document).ready(function(){
              
              $('.content').css("border","1px solid #f00");
              
          });
      
  </script>

2、为DOM元素添加类

使用.addClass()方法。只要把类的名字作为参数传递给这个方法就可以了。不过不能在名字的前面加上点。

$('.content').addClass("class1");

如果目标元素原来已经有一个类，则新类会被添加到该类之后。如果需要一次添加多个类，只需要用空格把这些类的名字隔开作为参数传入。

$('.content').addClass("class1 class2");

3、为DOM元素删除类

使用.removeClass()方法，它和.addClass()的工作方式完全相同。

$('.content').removeClass("class1");

如果没有为这个方法指定参数，则目标元素的所有类都将删除。

$('p').removeClass(); //删除匹配的目标元素的所有类

4、让DOM元素切换类

使用.toggleClass()方法

$('p').toggleClass("class1"); //为p元素切换.class1类。如果p元素没有这个类，就把这个类加上，反之就把这个类去掉。