DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 通過js為元素添加多項樣式,浏覽器全兼容寫法
通過js為元素添加多項樣式,浏覽器全兼容寫法
編輯:關於JavaScript     

js給元素添加多項樣式,浏覽器全兼容示例寫法:

<a href="javascript:;" id="test" style="font-size:25px;background:#080;">測試3</a>
<script>
var obj=document.getElementById("test");
var oldStyle=obj.style.cssText;
alert(oldStyle);
obj.style.cssText="border:2px red solid;color:#f00;"+oldStyle;
</script>

js給元素添加多項樣式,最快捷方便的是使用cssText屬性,但其會重寫整個style原有的值,要保留原先的style樣式值,很簡單,可像上示例中一樣,用一個變量記錄下原先的style原始值,再做一個字符串的拼接即可。

但要注意的一點是:ie8及以下浏覽器obj.style.cssText返回的最後一個樣式值是沒分號的,形如:font-size:25px;background:#080 。只想說,ie一如既往的讓人感覺不爽,呵呵。

所以示例中有意將oldStyle放置在字符串拼接的後面,這樣拼接的樣式字符串就算最後一個樣式值沒分號,也不會出問題,各浏覽器樣式應用顯示就一致了,這也算是一個小技巧吧,沒啥技術含量,但易忽略或忘記,知道自己記性不好,Mark下 ^_^

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved