jquery設定元素css樣式的幾種方式
在jquery中提供了集中對元素進行樣式設定的方式,下面就做一下簡單的介紹。
一.使用css()方法:
利用css()函式可以設定樣式的一個屬性或者同時設定多個屬性。
設定一個樣式屬性:
[JavaScript] 純文字檢視 複製程式碼$("div").css("color","red")
設定多個樣式屬性:
[JavaScript] 純文字檢視 複製程式碼$("div").css({color:"red",fontSize:20})
更多相關內容可以參閱jQuery css()一章節。
二.使用addClass()方法:
此方法可以為指定的物件新增class樣式類,一次性可以新增一個或者多個。
新增一個樣式類:
[JavaScript] 純文字檢視 複製程式碼$("div").addClass("border");
新增多個樣式類:
[JavaScript] 純文字檢視 複製程式碼$("div").addClass("border reset");
更多相關內容可以參閱jQuery addClass()一章節。
三.使用removeClass()方法:
此函式可以刪除指定元素的樣式類,可以使用它移除所有的樣式類或者指定的樣式類。
刪除所有的樣式類:
[JavaScript] 純文字檢視 複製程式碼$("div").removeClass();
如果方法沒有引數,可以移除匹配元素上的所有樣式類。
刪除指定的樣式類:
[JavaScript] 純文字檢視 複製程式碼$("div").removeClass("font bg");
可以一次移除一個或者多個樣式類。
更多相關內容可以參閱jQuery removeClass()一章節。
四.使用toggleClass()方法:
此函式可以切換指定樣式的刪除或者新增。
[JavaScript] 純文字檢視 複製程式碼$("div").toggleClass("bg")
以上程式碼可以切換樣式類bg的刪除或者新增。
更多相關內容可以參閱jQuery toggleClass()一章節。
相關文章
- JS設定css樣式的幾種方式JSCSS
- jquery css()方法設定元素的樣式簡單介紹jQueryCSS
- CSS 設定svg元素樣式CSSSVG
- js style方式設定元素的樣式JS
- javascript使用style方式設定元素的樣式JavaScript
- 網頁中應用CSS樣式的幾種方式網頁CSS
- css設定第2個li元素的樣式CSS
- CSS 設定前n個li元素樣式CSS
- CSS 設定指定範圍li元素樣式CSS
- CSS設定第n個li元素樣式CSS
- CSS 設定第n個li元素樣式CSS
- CSS匹配指定li元素並設定樣式CSS
- css設定type為text的input元素的樣式CSS
- jquery css()一次性為多個元素設定多個樣式jQueryCSS
- 動態設定元素的css樣式簡單介紹CSS
- canvas—元素樣式設定Canvas
- jQuery動畫方式設定元素的透明度jQuery動畫
- CSS 設定元素第一行文字樣式CSS
- CSS設定元素邊框樣式例項程式碼CSS
- jquery動態設定為元素樣式程式碼例項jQuery
- 使用jquery操作元素的css樣式(獲取、修改等等)jQueryCSS
- CSS應用給網頁元素的幾種方式總結CSS網頁
- css引入的幾種方式CSS
- jQuery以動畫方式設定元素的透明度jQuery動畫
- JS如何設定元素樣式?JS
- CSS 設定從第n個開始li元素樣式CSS
- js動態設定元素css樣式程式碼例項JSCSS
- CSS 設定 <progress>樣式CSS
- CSS 設定列表樣式CSS
- CSS 設定文字樣式CSS
- react之四種元件中DOM樣式設定方式React元件
- CSS 定義第二個li元素樣式CSS
- CSS設定連線<a>的樣式CSS
- JQuery屬性與樣式——樣式操作.css()和元素資料的儲存.data()jQueryCSS
- jQuery使用css()方法設定元素的display屬性值jQueryCSS
- 使用CSS定義頁面元素的外觀樣式CSS
- CSS 設定table表格樣式CSS
- CSS 設定連結樣式CSS