当前位置:Gxlcms > JavaScript > 原生JavaScript来实现对dom元素class的操作方法(图文教程)

原生JavaScript来实现对dom元素class的操作方法(图文教程)

时间:2021-07-01 10:21:17 帮助过:2人阅读

这篇文章主要介绍了原生JavaScript来实现对dom元素class的操作方法,提供了代码toggleClass的测试例子,具体操作步骤大家可查看下文的详细讲解,感兴趣的小伙伴们可以参考一下。

jQuery操作class的方式非常强大

写了一个利用原生js来实现对dom元素class的操作方法

1.addClass:为指定的dom元素添加样式
2.removeClass:删除指定dom元素的样式
3.toggleClass:如果存在(不存在),就删除(添加)一个样式
4.hasClass:判断样式是否存在

下面为一toggleClass的测试例子

[html] view plain copy
<style type="text/css"> 
 p.testClass{ 
 background-color:gray; 
 } 
</style>
<body> 
 <p id = "test" style = "width:250px;height:100px;"> 
 sssssssssssss 
 </p> 
 <input type = "button" value = "toggleClassTest" onclick = "toggleClassTest();" /> 
</body>

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

NodeJS父进程与子进程资源共享步骤详解

p5.js鼠标交互如何实现并使用

JS匿名自执行函数概念与使用说明

以上就是原生JavaScript来实现对dom元素class的操作方法(图文教程)的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行