所属栏目:发布日期:2022-11-16 08:36浏览量:3344作者:admin
我们有时候做网站或者做某些特效时要用到添加class类名,和移除class类名,下面小编就来简单介绍几种添加和删除类名的方法:
添加类属性:
// 一次只能设置一个类值,如果当前属性本身存在类值,会被替换 element.className = '类名'; /* * .setAttribute 用来设置自定义属性和值的 * 自定义属性:原本标签中没有这个属性,为了存储数据,方便操作自己设置添加的。 * 自定义属性无法直接通过DOM对象的方式获取或设置 * 可以通过 .getAttribute 方法获取 * 因为"class"是系统自有的属性,所以直接传入"class"后也可以生效 */ element.setAttribute('属性名','值'); 长沙网站开发 // .classList 是一个只读属性,会以字符串数组的形式返回这个元素的所有类名(类列表) // 如果类属性没有设置或者为空,会返回 0 // 虽然是只读属性,但是可以配合使用 add(), remove() 和 toggle() 方法修改它 // add() 往类属性内添加类值,可以一次添加多个类值,如果当前类属性存在多个类值,该方法也可以添加,不会清除替换原有的类值 // remove() 移除类列表内的类值,可以一次移除多个 // toggle() 判断元素类列表内有没有某个类名,有则移除,没有则添加(切换效果),同样,如果类属性存在多个类值,添加时不会清除替换原有的类值 element.classList.add('类名');
移除类属性:
// 把元素的类属性值替换成空 "",清空的是类值,class属性还在 element.className = ""; // 移除指定的自定义或系统的属性和其值,整个移除,去污不残留 element.removeAttribute('类名'); // 移除类列表内指定的类值,可以一次移除多个,移除的是类值,class属性还在 element.classList.remove('类名1','类名2',...);
以上就是javascript中添加和移除类名的几种常用方法,希望对您有用,更多资讯和教程请关注长沙网站建设