通過js為元素添加多項樣式,瀏覽器全相容寫法,js全相容

來源:互聯網
上載者:User

通過js為元素添加多項樣式,瀏覽器全相容寫法,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放置在字串拼接的後面,這樣拼接的樣式字串就算最後一個樣式值沒分號,也不會出問題,各瀏覽器樣式應用顯示就一致了,這也算是一個小技巧吧,沒啥技術含量,但易忽略或忘記,知道自己記性不好,Mark下 ^_^


用JS改變樣式都有什寫法?

<script language="javascript">
function chgB(obj)
{
obj.style.fontWeight="bold";
}
function cls(obj)
{
obj.style.fontWeight="normal";
}
</script>
<div style="font-weight:normal;" onmouseover="chgB(this)"

onmouseout="cls(this)"> abcd測試用</div>
 
怎用JS更改已載入的CSS樣式表樣式?要詳細的教程

樓上已經說的很好了,不過用jquery更加簡單一些,譬如要更改class為undis的樣式,則
$(".undis").css("margin-left","30px");
或者為它增加一個class
$(".undis").addcss("dis");這樣也可以~
這個好處就是css的樣式一樣,用js的話,css樣式寫法,有所差異,例如margin-left,在js裡,就要寫成marginleft
 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.