3、jQuery 样式操作
1、操作 css 方法
(1)参数只写属性名,则是返回属性值
$("div").css(''color'');
(2)参数是属性名,属性值,逗号分隔,是设置一组样式
$("div").css(''color'', ''red'');
// 属性名必须加引号
$("div").css("width", 300);
// 值如果是数字可以不用跟单位加引号
(3) 参数可以是对象形式,方便设置多组样式
$("div").css({
// 属性名和属性值用冒号隔开
// 属性可以不用加引号
width: 400,
height: 400,
backgroundColor: "red"
// 如果是复合属性则必须采取驼峰命名法
// 如果值不是数字,则需要加引号
})
2、设置类样式方法
设置类样式方法作用等同于 classList,可以操作类样式
(注意操作类里面的参数不要加点)
(1)添加类
$(“div”).addClass("current");
(2)移除类
$(“div”).removeClass("current");
(3)切换类
$(“div”).toggleClass("current");
3、类操作与className区别
(1)原生 JS 中 className 会覆盖元素原先里面的类名
var one = document.querySelector(".one");
one.className = "two";
(2)jQuery 里面类操作只是对指定类进行操作,不影响原先的类名
$(".one").addClass("two"); // addClass相当于追加类名
$(".one").removeClass("two");