Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

classList 元素的类列表操作

  在低版本IE上,获取类名需要访问元素的className属性取得整个类名字符串,再用正则表达式或其它字符串处理函数来分割。现代浏览器提供了classList属性,可以从中直接找到已经处理好的类名,还提供了添加、删除、判断,等一系列操作。
  访问classList属性得到的是一个拟数组对象 <div class="a b c" id="div"></div>
<script>
console.dir(div.classList);
</script>

  这个对象上还提供了addremovecontainstoggle,这些方法。下面是具体的使用的范例 <style>
.a {
  cursor:pointer;
  -webkit-user-select:none;
  -moz-user-select:none;
}
.b {font-weight:bold;}
.c {color:red;}
</style>
<div class="b c" id="div">test</div>
<script>
div.classList.add("a");
div.classList.remove("b");
div.onclick=function(){
  div.classList.toggle("c");
  console.log(div.classList.contains("c"));
};
</script>
  
网名:
34.203.213.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^