javascript 動態修改css樣式

方法一:改變外聯css文件,這里不講這個。

方法二:通過改變claaName來改變樣式,語法:

obj.className = "style2";//或者

obj.setAttribute("class", "style2");

方法三:使用obj.style.cssTest,語法:

 obj.style.cssText = " display:block; color:White;“

這個方法優點:

? ? ? ? ? ? ?可以這樣添加好幾個屬性。

缺點:會把obj原來的cssText清掉,解決方案:使用累加,語法:

obj.style.cssText =?" display:block; color:White;“

上面cssText累加的方法在IE中是無效的。

然而,可以在前面添加一個分號來解決這個問題:

?obj.style.cssText =?" ; display:block; color:White;“

注意:如果前面有樣式表文件寫著 div { text-decoration:underline; },這個會被覆蓋嗎?不會!因為它不是直接作用于 HTML 元素的 style 屬性。

方法四: 使用obj.style.backgroundColor,語法:

obj.style.backgroundColor= "black";

注意:backgroundColor可以換成其他屬性,這里僅是示例,比如color,position等。

?

?

最后一個知識點:css?Sprite,

就是有一張大圖,通過控制background-position來實現顯示大圖的某一部分。可以用來制作動畫。這個大圖是作為background-image:。

優點是減少http請求,缺點是定位麻煩。維護麻煩。

具體用法請移步:https://blog.csdn.net/u011349149/article/details/24181675

?

本文轉載于:猿2048?https://www.mk2048.com/blog/blog.php?id=kbhijib&title=javascript 動態修改css樣式

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/370310.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/370310.shtml
英文地址,請注明出處:http://en.pswp.cn/news/370310.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

POJ 3225 Help with Intervals(線段樹)

POJ 3225 Help with Intervals 題目鏈接 集合數字有的為1,沒有為0,那么幾種操作相應就是置為0或置為1或者翻轉,這個隨便推推就能夠了,然后開閉區間的處理方式就是把區間擴大成兩倍,偶數存點,奇數存線段就可…

在Spring中嵌入HSQLDB服務器實例

我一直在愉快地使用XAMPP進行開發,直到不得不將其托管在可通過Internet訪問的某個地方,供客戶端進行測試和使用。 我有一個僅具有384 RAM的VPS,并且需要快速找到一種方法,因此決定將XAMPP安裝到VPS中。 由于內存不足,因…

python與材料計算公式_《從問題到程序:用Python學編程和計算》——2.11 補充材料-阿里云開發者社區...

本節書摘來自華章計算機《從問題到程序:用Python學編程和計算》一書中的第2章,第2.11節,作者 裘宗燕,更多章節內容可以訪問云棲社區“華章計算機”公眾號查看。2.11 補充材料本書各章的主要內容將圍繞著怎樣通過編程解決計算問題…

centos 6.9 NTP基準時間服務器配置

時間服務器端 yum install ntp -y vim /etc/ntp.conf 增加允許客戶端訪問 restrict 192.168.0.0 mask 255.255.0.0 nomodify 配置成自啟動 chkconfig ntpd on service ntpd start 客戶端配置 每天對時一次 crontab -e * 2 * * * ntpdate 192.168.139.130 轉載于:https://www.cn…

hsdfz -- 6.16 -- day1

恩這回不寫游記了 按照老師要求記錄今天的心里路程:這題似乎可做期望得分150->日部分分似乎不是很顯然->a題似乎是結論題,大力猜一波結論->過不了樣例,先看b題->b題動態樹,似乎可以肝lct->不會維護重鏈&#xff0c…

課時39.細線表格(理解)

請你設計出以下圖片里的這個樣式的表格 步驟: 我先來制作一個兩行兩列的表格 2.將table里的cellspacing設置成0 外邊距是不見了,但是和我們想要完成的圖片有一定的差距,我們發現這樣做出來的圖片好像是兩條線合并到了一起一樣,實…

強制Tomcat通過SLF4J / Logback登錄

因此,您將JAR可執行Web應用程序與Tomcat捆綁在一起 (請務必先閱讀其中一個)。 但是,開頭有這些煩人的Tomcat日志,與我們的應用程序日志無關,并且不可自定義: Nov 24, 2012 11:44:02 PM org.apa…

matlab拼碎紙片過程,碎紙片拼接復原模型

1. 引言破碎文件的拼接在司法物證復原、歷史文獻修復以及軍事情報獲取等領域都有著重要的應用。企事業、機關、院校和軍隊基于保密的需要,使用碎紙機對重要文件,單據以及材料進行銷毀。一些重要的文件隨著時間流逝,殘破不全,因此&…

python實現貝葉斯分類器_python實現簡單的樸素貝葉斯分類器

本文使用的測試問題是“皮馬印第安人糖尿病問題”這個問題包括768個對于皮馬印第安患者的醫療觀測細節,記錄所描述的瞬時測量取自患者的年齡,懷孕和血液檢查的次數。所有患者都是21歲以上的女性,所有屬性都是數值型,而且屬性的單位…

VC++編譯MPIR 2.7.0

目錄 第1章編譯 2 1.1 簡介 2 1.2 下載 3 1.3 解決方案 4 1.4 創建項目 5 1.5 復制文件樹 6 1.6 不使用預編譯頭文件 8 1.7 包含目錄 9 1.8 定義宏 10 1.9 編譯前事件 11 1.10 修改 obj 的位置 13 1.11 編譯yasm 14 1.12 編譯匯編代碼 …

PHP大數據處理【轉】

1:硬件方面 普通的一個p4的服務器每天最多能支持大約10萬左右的IP,如果訪問量超過10W那么需要專用的服務器才能解決,如果硬件不給力 軟件怎么優化都是于事無補的。主要影響服務器的速度 有:網絡-硬盤讀寫速度-內存大小-cpu處理速度…

http1.X與2.0

HTTP HTTP 1.X HTTP是建立在TCP協議上的,HTTP協議的瓶頸及優化都是基于TCP協議本身的特性。TCP建立連接時有三次握手 會有1.5RTT的延遲,為了避免每次請求都經歷握手待來的延遲,應用層會選擇不同策略的http長連接。 HTTP 1.0 連接不能復用以…

php代碼清除空格注解,去除php注釋和去除空格函數分享

雖然php5中已有php_strip_whitespace方法可以返回刪除注釋和空格后的PHP源碼的功能,為了學習,這里為大家提供一個自己的方法,也可以去除代碼中的空白和注釋,代碼如下:. 代碼如下:/*** 去除代碼中的空白和注釋* param s…

包裝的重要性

我記得大約15年前開始學習Java的時候。 我讀了很多有關“包裝”和“命名空間”的東西,但我完全不了解。 可悲的是:雖然包裝的某些方面幾乎為業內每個人所了解,但其他方面卻并非如此。 因此,讓我們看一下哪些軟件包最適合。 命名空…

我的python學習筆記全集_我的python學習筆記

(此文是在實際工程中遇到的一些小問題,給予解決和整理。解決方法大多來自網上零散的文章。)1——如下代碼,a[1,2,3]bab也是[1,2,3]了,接著a[0]4a[1]5a[2]6此時a變成[4,5,6]了,再看b,a變了之后沒有對b進行新的引用&…

課時28.假鏈接(掌握)

什么是假鏈接? 就是點擊之后不會跳轉的鏈接我們稱之為假鏈接。 假鏈接存在的意義? 在企業開發前期,其他界面都沒有寫出來,那么,我們就不知道應該跳轉到什么地方,所以就只能使用假鏈接來代替,…

筆記45 | 代碼性能優化建議[轉]

地址 筆記45 | 代碼性能優化建議[轉] 目錄 前言避免創建不必要的對象選擇Static而不是Virtual常量聲明為Static Final避免內部的Getters/Setters使用增強的For循環使用包級訪問而不是內部類的私有訪問避免使用float類型使用庫函數謹慎使用native函數關于性能的誤區前言 通常來說…

導彈攔截

鏈接 分析:經典DP題,最長不下降子序列的變種,同時需要記錄路徑,用pre[]數組記錄當前結點的前一個結點的方法很妙 1 #include "iostream"2 #include "cstdio"3 #include "cstring"4 #include "…

JUnit4參數化和理論示例

我始終依靠TestNG將參數傳遞給測試方法,以便為我的測試或套件提供一些靈活性。 但是,使用JUnit4可以實現相同的靈活性。 要使用它很簡單: package com.marco.test;import java.util.Arrays;import java.util.Collection;import junit.fram…

楊杰matlab神經網絡30例,MATLAB神經網絡30例

實例1 BP神經網絡在非線性函數擬合中的應用11.1 理論基礎11.1.1 BP網絡概述11.1.2 BP神經網絡的MATLAB函數21.2 非線性函數擬合方法6實例2 主元BP神經網絡在股票價格預測中的應用122.1 理論基礎122.1.1 主成分分析的原理122.1.2 主元神經網絡與股票預測142.2 股票價格的預測方法…