DIV CSS 佈局教程網

在Web程序開發中、很多時候會用需要修改Html標簽的class名稱、來達到修改標簽樣式的效果、那麼在代碼中一般是怎麼操作的呢、本文將為你詳細講解一下class的使用、在jQuery中可以使用attr()方法修改”class”屬性、也可以用addClass()、removeClass()、toggleClass()、hasClass()以及css()方法來完成

1、addClass

利用document.getElementById("XX")找到document對象、然後再通過addClass("xxx")修改其class值

document.getElementById("XX").addClass("xxx");

2、addClass()

addClass()方法向匹配的元素增加指定的類名(一個或多個)、注意對於元素來說、class屬性可以有多個值、該方法不會移除已經存在的值、而是在原有的基礎上追加一個或多個class屬性

$(".XX").addClass("xxx");

3、removeClass()

removeClass()方法從被選元素移除一個或多個類、如需移除若干類、用空格來分隔類名、如果沒有傳參數、該方法將會移除被選元素的所有類

$(".XX").removeClass("xxx");

4、toggleClass()

toggleClass()方法對被選元素的一個或多個類進行切換(設置或移除)、該方法檢查每個元素中的指定類、如果存在則刪除、如果不存在則添加、通過添加參數,可以設置只進行刪除或者只進行添加操作、switch值為true時、只添加、為false時、只刪除

$(".XX").toggleClass("xxx",switch);

5、hasClass()

hasClass()方法檢查被選元素是否包含指定的class、還可以用is()方法實現同樣的功能、方法參數傳入一個選擇器字符串、比如”.className”

$(".XX").hasClass("xxx");

6、css()

讀操作：獲取匹配元素集合中第一個元素的指定樣式值(一個或多個)、讀取多個樣式值的操作是在jQuery v1.9才加入的

寫操作: 為匹配元素集合中的每一個元素設置一個或多個CSS屬性的值、傳入的參數可以是單個的鍵值對、也可以是PlainObject指定的多個值

$(".XX").css("color","red");

7、attr()

attr()方法設置或返回被選元素的屬性值、根據該方法不同的參數、其工作方式也有所差異

$(".XX").attr("class","xxx");

jQuery會處理各個浏覽器中不太相同的一些具體情況、比如W3C的cssFloat在IE中是styleFloat、在jQuery中、你可以使用float、然後jQuery會幫你把它翻譯成每個浏覽器中應該有的正確名稱、還有、jQuery會合理解讀CSS和DOM格式的多詞屬性、比如.css(“background-color”)和.css(“backgroundColor”)、它都是可以處理的