JS修改css樣式的幾種方法
當(dāng)前位置:點(diǎn)晴教程→知識(shí)管理交流
→『 技術(shù)文檔交流 』
本文試驗(yàn)了幾種JS修改css樣式的方法: .cssText這種,可以用一行改變本元素多個(gè)樣式,直接后面寫很多css樣式。 測(cè)試代碼: <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>黃藍(lán)(默認(rèn)) <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";//帶-號(hào)的css樣式用這個(gè)格式 document.getElementById("D1").style['border']="10px solid #fcfe3f"; }; </script> 圖示:點(diǎn)擊單選框,選擇不同的背景色和邊框色。
該文章在 2023/9/28 1:07:49 編輯過(guò) |
關(guān)鍵字查詢
相關(guān)文章
正在查詢... |