通過js為元素添加多項樣式,瀏覽器全兼容寫法
更新時間：2014年08月30日 16:39:00 投稿：mdxy-dxy
這篇文章主要介紹了通過js為元素添加多項樣式,瀏覽器全兼容寫法,需要的朋友可以參考下
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放置在字符串拼接的后面，這樣拼接的樣式字符串就算最后一個樣式值沒分號，也不會出問題，各瀏覽器樣式應(yīng)用顯示就一致了，這也算是一個小技巧吧，沒啥技術(shù)含量，但易忽略或忘記，知道自己記性不好，Mark下 ^_^
相關(guān)文章
這篇文章主要為大家詳細介紹了微信小程序模板之分頁滑動欄的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
JavaScript測試工具之Karma-Jasmine的安裝和使用詳解
Jasmine是一個Javascript的測試工具，在Karma上運行Jasmine可完成Javascript的自動化測試、生成覆蓋率報告等。本文不包含Jasmine的使用細節(jié)，這幾天我會寫一篇Jasmine的入門文章，有興趣的朋友到時候可以看一下2015-12-12
在開發(fā)百度“地裂特效”時，發(fā)現(xiàn)了一些匪夷所思的 bug，第一反應(yīng)是特效本身的代碼與頁面上原有的腳本發(fā)生了沖突，經(jīng)過調(diào)試發(fā)現(xiàn)，問題出現(xiàn)在 cloneNode 的應(yīng)用上2012-11-11
ECHO.js 純javascript輕量級延遲加載的實例代碼
下面小編就為大家?guī)硪黄狤CHO.js 純javascript輕量級延遲加載的實例代碼。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要為大家詳細介紹了小程序自定義彈框效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
這篇文章主要給大家介紹了關(guān)于js如何在字符串中查找某個字符的位置的相關(guān)資料,在JavaScript中我們經(jīng)常需要對字符串進行各種操作,包括查找包含特定字符的字符串,需要的朋友可以參考下2023-11-11
js實現(xiàn)點擊按鈕后給Div圖層設(shè)置隨機背景顏色的方法
這篇文章主要介紹了js實現(xiàn)點擊按鈕后給Div圖層設(shè)置隨機背景顏色的方法,實例分析了javascript操作頁面div元素屬性及隨機數(shù)的相關(guān)技巧,需要的朋友可以參考下2015-05-05
一個特殊的排序需求的javascript實現(xiàn)代碼
看了之后1是手癢癢，2是覺得樓主的實現(xiàn)有問題，就動手寫了一下，用js,大概用了30-40分鐘。2009-09-09
這篇文章主要為大家詳細介紹了移動端手指操控左右滑動的菜單，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-09-09
js日期相關(guān)函數(shù)dateAdd,dateDiff,dateFormat等介紹
這篇文章主要介紹了js日期相關(guān)函數(shù)dateAdd,dateDiff,dateFormat等介紹,需要的朋友可以參考下2016-09-09