摘要:删除任意数量的类名,若类名不存在,也不会抛出异常。起始根据索引返回相应的类名。起始输出用新的类名替换指定的类名。起始兼容性及以下不支持
介绍
可以用来替代以 element.className 访问和操作 CSS 类名的方式
返回元素 class 属性的 DOMTokenList,本身只读,但是可以通过自身的 add / remove 等方法修改元素的 class 属性
若元素的 class 属性未设置或者为空,则 classList.length 为 0
用法 add( String [, String [, ...]] )添加任意数量的类名,若类名已存在则会被忽略。
const div = document.createElement("div"); const cls = ["foo", "bar"]; div.className = "foo"; // "foo" div.classList.add(...cls); // "foo bar" div.classList.add("bar baz"); // "foo bar baz"remove( String [, String [, ...]] )
删除任意数量的类名,若类名不存在,也不会抛出异常。
// 起始:"foo bar baz" div.classList.remove("foo"); // "bar baz"item( Number )
根据索引返回相应的类名。
// 起始:"bar baz" console.log(div.classList.item(1)); // 输出:"baz"toggle( String [, force] )
当只有一个参数时:
若类名已存在,则删除指定的类名并返回 false
若类名不存在,则添加指定的类名并返回 true
当有两个参数时:
若第二个参数的值为 true,则添加指定的类名
若第二个参数的值为 false,则删除指定的类名
// 起始:"bar baz" div.classList.toggle("foo"); // "foo bar baz" div.classList.toggle("foo"); // "bar baz" div.classList.toggle("foo", 2 < 1 ); // "bar baz"contains( String )
检查指定的类名是否存在。
// 起始:"bar baz" console.log(div.classList.contains("foo")); // 输出:falsereplace( oldClass, newClass )
用新的类名替换指定的类名。
// 起始:"bar baz" div.classList.replace("bar", "foo"); // "foo baz"兼容性
IE 9 及以下不支持
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/54094.html
摘要:删除任意数量的类名,若类名不存在,也不会抛出异常。起始根据索引返回相应的类名。起始输出用新的类名替换指定的类名。起始兼容性及以下不支持 介绍 可以用来替代以 element.className 访问和操作 CSS 类名的方式 返回元素 class 属性的 DOMTokenList,本身只读,但是可以通过自身的 add / remove 等方法修改元素的 class 属性 若元素的 c...
摘要:定义是一个由可以接收事件的对象实现的接口,并且可以为它们创建侦听器。重点分割线只有通过上面的继承关系,我们得到的元素才是一个完整的对象,我们才能为它设置获取属性绑定事件添加样式类等操作。 写在前面,本文将同步发布于Blog、掘金、segmentfault、知乎等处,如果本文对你有帮助,记得为我得到我的个人技术博客项目给个star哦。 为何写这篇文章? 你可能做Web开发已经有一段时间,...
阅读 558·2021-11-22 14:45
阅读 3035·2021-10-15 09:41
阅读 1465·2021-10-11 10:58
阅读 2657·2021-09-04 16:45
阅读 2554·2021-09-03 10:45
阅读 3204·2019-08-30 15:53
阅读 1194·2019-08-29 12:28
阅读 2084·2019-08-29 12:14