通过JS操作CSS

最新推荐文章于 2022-03-04 17:46:55 发布

SeeAnCat

最新推荐文章于 2022-03-04 17:46:55 发布

阅读量316

点赞数

文章标签： javascript css

本文链接：https://blog.csdn.net/weixin_45238180/article/details/108090051

版权

通过jss操作css

操作方法

操作方法

1.通过style属性来修改css
DOM Style对象

标签对象.style.CSS属性="值";

 如：var ziti = document.getElementById('test');

                    ziti.style.color = 'red';
                    

注意：在JavaScript中CSS属性的写法和CSS中的属性写法不一样
CSS中多个单词使用 - 隔开

JavaScript中，使用驼峰命名法

font-size           fontSize
margin-top          marginTop
background-color    backgroundColor

2.通过class属性/ID选择器来重置选择器
标签对象.className=“类选择器1 类选择器2”
标签对象.id=“ID选择器”
　如：
let card = document.querySelector(".card");
card.addEventListener(‘mouseover’,function(){
card.className=“card card2”;
card.id=“abc”;
});