,,

JS修改css樣式的幾種方法

當前位置：點晴教程→知識管理交流 →『技術文檔交流』

admin

2023年9月28日 1:7 本文熱度 951

本文試驗了幾種JS修改css樣式的方法：
方法1：元素.style.樣式=樣式值。
方法2：元素.style.cssText=樣式：樣式值
方法3：元素.style[樣式]=樣式值

.cssText這種，可以用一行改變本元素多個樣式，直接后面寫很多css樣式。
.style.樣式，這種，逐個樣式進行修改。
如果樣式有-短線，如background-color,可以用方法3，style跟著樣式加中括號。

測試代碼：

<style>#D1{background-color:#fcfe3f;padding:50px;margin:11px;border:10px solid blue;width:200px;}</style>
</head>
<body>
<input type="radio" id="r1" name="s" onclick="YB()" checked>黃藍(默認）
<input type="radio" id="r2" name="s" onclick="PR()">粉紅
<input type="radio" id="r3" name="s" onclick="GY()">綠黃
<br>
<div id="D1">文字</div>
<script language="javascript" type="text/javascript">   
 function YB(){
     document.getElementById("D1").style.background="#fcfe3f";
     document.getElementById("D1").style.border="10px solid blue";
 };
function PR(){
     document.getElementById("D1").style.cssText="background:#e87ca2;border:10px solid red";
 };
function GY(){
     document.getElementById("D1").style['background-color']="#84d192";//帶-號的css樣式用這個格式
     document.getElementById("D1").style['border']="10px solid #fcfe3f";
 };
</script>

圖示：點擊單選框，選擇不同的背景色和邊框色。

該文章在 2023/9/28 1:07:49 編輯過

關鍵字查詢

css

樣式

修改

正在查詢...

點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。

點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理，結合碼頭的業務特點，圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體，是物流碼頭及其他港口類企業的高效ERP管理信息系統。

點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。

點晴免費OA是一款軟件和通用服務都免費，不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。

公交车上荫蒂添的好舒服的电影-公用玩物(np双xing总受)-公用小荡货芊芊-公与妇仑乱hd-攻把受做哭边走边肉楼梯play-古装一级淫片a免费播放口

JS修改css樣式的幾種方法