在編寫網頁時,我們經常需要獲取body的css樣式,以便對網頁進行樣式調整。下面,我們來看一下如何實現這個功能。
// 獲取body元素 var body = document.getElementsByTagName('body'); // 獲取body元素的css樣式 var style = window.getComputedStyle(body[0]); // 通過style可以獲取body元素的所有css屬性 // 例如,獲取背景色 var bgColor = style.backgroundColor; // 獲取字體大小 var fontSize = style.fontSize; // 獲取文字顏色 var fontColor = style.color; // 等等 console.log(bgColor); console.log(fontSize); console.log(fontColor);
從上面的代碼可以看出,我們通過window.getComputedStyle()方法獲取body元素的css樣式,并可以通過style對象來獲取各種屬性。不過需要注意的是,由于style對象的屬性名是css樣式中的屬性名,故要按照css語法規范來編寫屬性名,例如background-color應該寫成backgroundColor。
除了上面介紹的方法外,我們還可以通過document.body.style對象來獲取body元素的css屬性值。
console.log(document.body.style.backgroundColor); console.log(document.body.style.fontSize); console.log(document.body.style.color);
這種方法可以獲取到直接在html標簽中定義的樣式,但不能獲取到在css樣式表中定義的樣式。
以上就是獲取body的css樣式的方法,希望能對大家有所幫助。