8.Javascript之獲取樣式信息

一、獲取樣式信息

通過.style.xxx的方式只能訪問內聯的css樣式

//Css部分
<style>
    #div{background-color :blue}
    .box{height: 300px; background-color:blue}
</style>

<body>
    <div id = "div1"></div>
</body>

要獲取當前有效樣式,系統提供的方法是:getComputedStyle((通過id獲取的單一節點)[要設置的樣式名])

//通過id名獲取到節點
var oDiv = document.getElementById("div1");

//獲取通過oDiv獲取到其height樣式信息
var height = getComputedStyle((oDiv)["height"]);

二、設置樣式

設置樣式只需要通過.style.xxx方式設置css樣式

//通過id名獲取到節點
var oDiv = document.getElementById("div1");

oDiv.style.backgroundColor = 'orange';
oDiv.style.height = '500px';
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章