css(层叠样式表)是我们在网页设计中经常用到的一种技术,它可以改变网页的外观和布局,并且可以使网页更加美观和易于阅读。在这篇文章中,我们将探讨如何用javascript来改变css的样式。
首先,在HTML中定义一个样式表。下面是一个简单的例子:
Hello World!
这个例子中,我们定义了两个CSS样式类“red”和“blue”,分别设定了文字颜色为红色和蓝色。
然后,在JavaScript中,我们可以用document.querySelector()方法来获取DOM元素,用.style属性来改变CSS样式。下面是一个例子:
const box = document.querySelector('#box');
const redBtn = document.querySelector('#redBtn');
const blueBtn = document.querySelector('#blueBtn');
redBtn.onclick = () => {
box.style.color = 'red';
};
blueBtn.onclick = () => {
box.style.color = 'blue';
};这个例子中,我们创建了三个变量,分别对应HTML中的
元素和两个