addClass()新增多個樣式屬性程式碼例項
關於addClass()基本用法這裡就不介紹了,具體可以參閱jQuery addClass()一章節。
本章節介紹一下如何如何實現一次性設定多個樣式屬性的效果。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> .a { font-weight:bold; font-size:18px; } .b{ color:blue; } </style> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script> $(document).ready(function () { $("#bt").click(function () { $("#antzone").addClass("a b"); }); }); </script> </head> <body> <div id="antzone">螞蟻部落</div> <input type="button" id="bt" value="檢視效果"/> </body> </html>
上面的程式碼給div元素一次性新增了兩個樣式類,只要他們之間用空格分隔即可。
相關文章
- javascript通用獲取元素樣式屬性值程式碼例項JavaScript
- 行內樣式新增多個style屬性,只會載入第一個style裡面的樣式
- js prototype屬性使用程式碼例項JS
- javascript的cssText屬性程式碼例項JavaScriptCSS
- 為textarea新增maxlength屬性程式碼例項
- css屬性選擇器程式碼例項CSS
- jQuery通過多個屬性篩選元素程式碼例項jQuery
- css樣式初始化程式碼例項CSS
- 樣式初始化程式碼例項分享
- css3 filter屬性作用演示程式碼例項CSSS3Filter
- JavaScript 例項屬性JavaScript
- jQuery新增和刪除元素class屬性例項程式碼jQuery
- css設定背景圖片樣式程式碼例項CSS
- CSS設定元素邊框樣式例項程式碼CSS
- 獲取iframe標籤的src屬性值程式碼例項
- javascript動態改變iframe元素src屬性程式碼例項JavaScript
- Python - 物件導向程式設計 - 類變數、例項變數/類屬性、例項屬性Python物件程式設計變數
- Python 類的屬性與例項屬性Python
- jquery動態設定為元素樣式程式碼例項jQuery
- jQuery使用css()方法改變元素樣式程式碼例項jQueryCSS
- jQuery新增或者刪除class樣式類程式碼例項jQuery
- js動態設定元素css樣式程式碼例項JSCSS
- 滑鼠懸浮改變連結樣式程式碼例項
- js通過type屬性值篩選input元素程式碼例項JS
- css字型樣式屬性CSS
- 使用window.open()函式開啟一個新頁面程式碼例項函式
- hasOwnProperty()函式程式碼例項函式
- css3自定義滾動條樣式程式碼例項CSSS3
- jQuery動態載入更新外部樣式表程式碼例項jQuery
- css自定義單選按鈕的樣式程式碼例項CSS
- table表格單元格橫向和屬性合併程式碼例項
- linear-gradient屬性製作邊框程式碼例項
- jQuery css()設定和獲取元素css屬性值程式碼例項jQueryCSS
- vue例項的屬性和方法Vue
- <input type="file">實現各個瀏覽器樣式統一程式碼例項瀏覽器
- (中級)快捷樣式屬性
- css彈性佈局程式碼例項CSS
- flex彈性佈局程式碼例項Flex