js style

作者：白话少年的痴情梦— 发布日期:2025-04-21 浏览:84

// 示例代码：使用JavaScript添加和修改CSS样式

// 获取HTML元素
const element = document.getElementById('myElement');

// 方法1：直接设置style属性
element.style.color = 'blue';  // 设置文本颜色为蓝色
element.style.fontSize = '20px';  // 设置字体大小为20像素

// 方法2：使用classList来操作类名
element.classList.add('new-class');  // 添加一个类
element.classList.remove('old-class');  // 移除一个类

// 方法3：使用CSS变量（自定义属性）
document.documentElement.style.setProperty('--main-color', 'red');  // 设置全局CSS变量

// 解释：
// 1. `element.style` 直接操作内联样式，适合简单的样式修改。
// 2. `classList` 更加灵活，可以通过添加、移除或切换类来控制样式。
// 3. CSS变量可以在整个页面中复用，并且可以通过JavaScript动态修改。

上一篇：js toggle

下一篇：js 设置style