在网页开发中,使用JavaScript可以实现各种动态效果,同时也可以使用JavaScript动态添加CSS样式。下面介绍一些使用JavaScript添加CSS样式的方法。
//通过JavaScript添加CSS样式 var style = document.createElement('style'); style.innerHTML = 'p{color: red;}'; document.head.appendChild(style);
上面这段代码可以在页面head标签中动态添加样式,这里以把p标签的文字颜色设置为红色为例。可以看到,使用JavaScript动态添加CSS样式非常方便。
//通过JavaScript动态修改元素的class属性 var ele = document.getElementById('test'); ele.className = 'new_class';
上面这段代码可以通过修改元素的class属性来添加CSS样式,这里以修改id为test的元素的class属性为new_class样式为例。这种方法可以方便的通过JavaScript来修改元素的样式
总结:利用JavaScript可以实现网页样式的动态效果,动态添加CSS样式是很常见的操作之一,通过上述方法可以方便的实现。