javascript获取和设置DIV元素class值的方法

人生最好的旅行,就是你在一个陌生的地方,发现一种久违的感动。你在看孤独的风景,你在逃避我的真心!

web页面中,利用js动态的改变div元素的class属性的值,可以实现很多的动态效果。比如动态修改div元素的背景颜色,改变字体的颜色等等。这篇文章就来说一说,javascript 如何获取和设置div元素class属性的值的方法。

js获取元素class属性值的方法

原生js如果想要获取div元素class属性的值,需要用到 className 方法

示例代码:

<div id="mochu" class="m m1"></div>
<script>
    //获取class属性的值
    var c = document.getElementById('mochu').className;
    console.log(c);
</script>

打印结果:

m m1

js设置元素class属性值的方法

js中的className 方法不仅仅可以获取div元素class属性的值,还可以设置div元素的值

示例代码:

<div id="mochu" class="m m1"></div>
<script>
    //设置class属性值
    document.getElementById('mochu').className = 'mm';
</script>

运行后的效果如下:

js获取和设置DIV元素class值的方法

注意:

使用 className 设置div元素属性值时,div元素原有的class属性值会被替换掉。

本文javascript获取和设置DIV元素class值的方法到此结束。耐心点,坚强点;总有一天,你承受过的疼痛会有助于你。小编再次感谢大家对我们的支持!

您可能有感兴趣的文章
如何解决移动端滑动验证时页面跟随移动的问题

javascript隐藏鼠标的方法

javascript压缩与格式化CSS代码的方法

javascript如何实现鼠标拖动div改变其位置的好代码教程

HTML+JS如何实现图片下载到本地