欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  描述: 获取匹配元素集合中的第一个元素的样式属性的值
  
  添加的版本: 1.0.css( propertyName )
  
  propertyName
  
  类型: String
  
  一个css属性名。
  
  添加的版本: 1.9.css( propertyNames )
  
  propertyNames
  
  类型: Array
  
  一个或多个CSS属性组成的一个数组
  
  .css()方法可以非常方便地获取匹配的元素集合中第一个元素的样式属性值, 对于某些属性而言,浏览器访问样式属性的方式是不同的,该方法对于取得这些属性是非常方便的(例如, 某些属性在标准浏览器下是通过的 getComputedStyle() 方法取得的,而在Internet Explorer下是通过currentStyle 和 runtimeStyle属性取得的)并且,某些特定的属性,不同浏览器的写法不一。举个例子, Internet Explorer的DOM 将float 属性写成 styleFloat实现,W3C标准浏览器将float 属性写成cssFloat。 为了保持一致性,您可以简单地使用"float",jQuery将为每个浏览器返回它需要的正确值。
  
  另外,jQuery同样可以解析 CSS 和 用multiple-word格式化(用横杠连接的词,比如:background-color)的DOM属性的不同写法。举个例子:jQery能解析.css('background-color') 和 .css('backgroundColor')并且返回正确的值。不同的浏览器可能会返回CSS颜色值在逻辑上相同,但在文字上表现不同,例如: #FFF, #ffffff, 和 rgb(255,255,255)。
  
  简写速写的CSS属性(例如: margin, background, border) 是不支持的,例如,如果你想重新获取margin,可以使用$(elem).css('marginTop') 和 $(elem).css('marginRight'),其他的也是如此。
  
  从jQuery 1.9开始, 传递一个CSS的样式属性的数组给.css()将返回 属性 - 值 配对的对象。例如,要获取元素4个边距宽度值border-width,你可以使用$( elem ).css([ "borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth" ]).
  
  例子:
  
  Example: 点击div,得到它的背景颜色
  
  <!DOCTYPE html>
  
  <html>
  
  <head>
  
  <style>
  
  div { width:60px; height:60px; margin:5px; float:left; }
  
  </style>
  
  <script src="https://code.jquery.com/jquery-latest.js"></script>
  
  </head>
  
  <body>
  
  <span id="result">&nbsp;</span>
  
  <div style="background-color:blue;"></div>
  
  <div style="background-color:rgb(15,99,30);"></div>
  
  <div style="background-color:#123456;"></div>
  
  <div style="background-color:#f11;"></div>
  
  <script>
  
  $("div").click(function () {
  
  var color = $(this).css("background-color");
  
  $("#result").html("That div is <span style='color:" +
  
  color + ";'>" + color + "</span>.");
  
  });
  
  </script>
  
  </body>
  
  </html>

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h64061.shtml