怎样用JS来添加CSS样式

怎样用JS来添加CSS样式,第1张

例如改变背景色:

1234567<div id="changeColor">使用JS改变背景色</div><script>var cc = document.getElementById("changeColor")cc.style.backgoundColor="#000"//将背景色改为黑色cc.style.fontSize="20px"// 将文字大小改为20px,等号右边也可以写为20+"px"cc.style.color="#fff"//将文字颜色改为白色</script>

在页面内用JS *** 作CSS除非用AJAX,但 *** 作页面内的样式的话,是可以的。 *** 作样式分为改变直接样式,改变className和改变cssText三种

一、局部改变样式

调用方法:

改变className

<div id="demo">测试</div>

<script>

document.getElementById('demo').className="test"

</script>

改变直接样式

<div id="demo">测试</div>

<script>

document.getElementById('obj').style.backgroundColor="#003366"

</script>

二、全局改变样式

可以通过改变外链样式的的href的值实现网页样式的实时切换

<link rel = "stylesheet" type="text/css" id="css" href="firefox.css" />

<span on click="javascript:document.getElementById('css').href = 'ie.css'">点我改变样式</span>

选中标签,然后用style设置样式

<div id="h5course">HTML5学堂(WX号),技术干货文章分享</div>

<script>

var box = document.getElementById('h5course')

box.style.color = '#39f'

box.style.border = '2px solid #000'

</script>


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11768738.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-18
下一篇2023-05-18

发表评论

登录后才能评论

评论列表(0条)

    保存