.css(propertyName)怎么使用

2024-04-02 19:55

短信预约 -IT技能 免费直播动态提醒

这篇文章主要介绍“.css(propertyName)怎么使用”，在日常操作中，相信很多人在.css(propertyName)怎么使用问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”.css(propertyName)怎么使用”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

　　描述: 获取匹配元素集合中的第一个元素的样式属性的值

　　添加的版本: 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>

　　</head>

　　<body>

　　$("div").click(function () {

　　var color = $(this).css("background-color");