您好,登錄后才能下訂單哦!
這篇文章主要介紹“.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>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<span id="result"> </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>
到此,關于“.css(propertyName)怎么使用”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注億速云網站,小編會繼續努力為大家帶來更多實用的文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。