jQuery修改class属性和CSS样式
cssclass属性jQuery修改class属性和CSS样式
class属性修改
  类属性即class属性，规定类名.
  ⽤类选择器规定样式的时候，需要为元素指定类名，即class属性的值.
  注意每个HTML元素只有⼀个class属性.但是class属性的值可以是多个名称，即可能包含⼀个词的列表，中间⽤空格分隔.
  具体使⽤⽅法见:
  ⽤jQuery进⾏类名修改既可以⽤attr()⽅法修改”class”属性，也可以⽤addClass(), removeClass(), toggleClass()等⽅法来完成.
addClass()
  API:
  addClass()⽅法向匹配的元素增加指定的类名(⼀个或多个).
  注意对于元素来说,class属性可以有多个值.该⽅法不会移除已经存在的值,⽽是在原有的基础上追加⼀个或多个class属性.  　⽤attr()⽅法设置class属性，是⼀个覆盖的过程;⽽addClass()则是⼀个追加的过程.
  class之间最终是⽤空格来隔开的.
  如果需要添加多个类,⽤空格分隔类名.
  从1.4开始，这个⽅法的参数也可以传⼊⼀个function.
removeClass()
  API:
  removeClass()⽅法从被选元素移除⼀个或多个类.如需移除若⼲类,⽤空格来分隔类名.
  如果没有传参数，该⽅法将会移除被选元素的所有类.
toggleClass()
  API:
  toggleClass()⽅法对被选元素的⼀个或多个类进⾏切换(设置或移除).
  该⽅法检查每个元素中的指定类，如果存在则删除，如果不存在则添加.
  通过添加参数，可以设置只进⾏删除或者只进⾏添加操作.
  格式:$(selector).toggleClass(class,switch)
  switch值为true时，只添加；为false时，只删除.
hasClass()
  API:
  hasClass()⽅法检查被选元素是否包含指定的class.
  还可以⽤is()⽅法实现同样的功能,⽅法参数传⼊⼀个选择器字符串,⽐如”.className”.
CSS样式修改
  jQuery中还有⼀些⽅法直接返回或者设置元素的CSS属性.
css()
  API:
  读操作: 获取匹配元素集合中第⼀个元素的指定样式值(⼀个或多个).
  注：读取多个样式值的操作是在jQuery v1.9才加⼊的.
  写操作: 为匹配元素集合中的每⼀个元素设置⼀个或多个CSS属性的值.
  传⼊的参数可以是单个的键值对，也可以是PlainObject指定的多个值，还可以是function.(v1.4).
  jQuery会处理各个浏览器中不太相同的⼀些具体情况,⽐如W3C的cssFloat在IE中是styleFloat，在jQuery中，你可以使⽤float，然后jQuery会帮你把它翻译成每个浏览器中应该有的正确名称.
  还有,jQuery会合理解读CSS和DOM格式的多词属性,⽐如.css(“background-color”)和.css(“backgroundColor”)，它都是可以处理的.
height()和width()
  API: 和
  ⾼度和宽度属性.这个宽⾼值不包括padding,border和margin.除⾮box-sizing属性被使⽤了.
  注意写操作的时候set的是content的宽⾼，不包括box-sizing的部分.
  读操作仍然是返回集合第⼀个元素的属性值.
  .css(“width”)和.width()的区别是：前者返回带单位的值,⽐如400px；后者返回不带单位的像素数值，即400.
  所以如果值需要被⽤于某种计算,.height()和.width()是被推荐使⽤的.
  读取得到的数值不⼀定是整型，并且如果⽤户缩放了页⾯，其值可能是不正确的，因为浏览器没有暴露这种情况的API.
  还有⼀种不准确的情况，当这个元素的⽗元素隐藏起来时，该元素的尺⼨可能读不准.
  写操作⽀持的value类型是字符串或者数字.
  如果是数字,jQuery默认是px为单位.
  如果是字符串，除了可以数字加单位之外，任何合理的CSS measurement都可以⽤,⽐如100%,50%，或者auto.
position()
  API:
  返回第⼀个匹配元素相对于⽗元素(offset parent)的位置.
  只有读操作.
offset()
  API:
  返回第⼀个匹配元素的坐标，或者设定每⼀个匹配元素的坐标，这个坐标是相对于document的.
offsetParent()
  API:
  返回⽗类，只有读操作.
scrollLeft()和scrollTop()
  API: 和
参考资料
  圣思园张龙⽼师JavaWeb视频教程75
  jQuery API:
  w3school 参考⼿册:
  属性操作:
  CSS操作:
  CSS类选择器:

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。