js操作class类的方法

最新推荐文章于 2024-03-14 23:11:52 发布
最新推荐文章于 2024-03-14 23:11:52 发布
阅读量939 收藏 2
点赞数 1
分类专栏： js 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45273782/article/details/117263646
版权

DOM里的每个节点上都有一个classList对象，既可以用里面的方法新增、删除、修改节点上的CSS类。也可以用它来判断某个节点是否被赋予了某个CSS类。

  • add(类名) 添加类名

  • remove(类名) 删除类名

  • replace(替换谁，替换成什么)替换

  • contains(类名) 布尔值

  • toggle(类名) 切换 返回值还是布尔值（有就切掉，没有就加上）

  • item(索引)

试试

添加类（add）

  • el.classList.add(‘red’,‘blue’);
留白_summer
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript中关于class的调用方法
01-19
PS：class的调用，其实是可以叠加的，当然了这要求样式不同的情况下，如果样式相同，则后一个样式会覆盖前一个样式。 1、举例如下： <div id=test class=aaa>测试关于class的调用</div> .aaa{ font-size:20px; color:red; } .bbb{ font-size:50px; color:green; } var test=document.getElementById('test'); test.className='aaa'; test.className='aaa bbb';//因为aaa和bbb的样式相
js中class类的基本使用
yy869949908的博客
12-15 4831
class类的基本使用
原生JS操作class属性
qq_39706777的博客
08-27 3745
原生JS操作class属性 1. classList Element.classList: DOMTokenList 通过classList获取元素的class属性值,使用以下方法操作class值 方法： add(className：String) 添加一个class值 remove(className:String)删除一个class值 replace(oldclassName: string, newclassName: string) 将一个class属性替换为另外一个 contains(cla
JavaScript class 类的基本使用方法你知道吗
CRMEB小程序商城的博客
05-09 2446
JavaScript 语言中，生成实例对象的传统方法是通过构造函数 class Point { // ... } typeof Point // "function" Point === Point.prototype.constructor // true 上面代码表明，类的数据类型就是函数，类本身就指向构造函数 使用的时候，也是直接对类使用new命令，跟构造函数的用法完全一致。 类的实例对象 class Bar { doStuff() { console.log('stuff');
JavaScript Class类详解
m0_37824255的博客
05-18 1万+
ECMAScript 6 提供了更接近传统语言的写法，新引入的class关键字具有正式定义类的能力。类（class）是ECMAScript中新的基础性语法糖结构，虽然ECMAScript 6类表面上看起来可以支持正式的面向对象编程，但实际上它背后使用的仍然是原型和构造函数的概念，让对象原型的写法更加清晰、更像面向对象编程的语法。
JS利用prototype给类添加方法操作详解
10-16
在JavaScript中，`prototype`是实现面向对象编程的关键特性，它允许我们为类（或称为构造函数）添加方法。在本文中，我们将深入探讨如何利用`prototype`为类添加方法，以及这种方法背后的原理。 首先，我们需要理解...
JavaScript实现获取dom中class的方法
10-24
主要介绍了JavaScript实现获取dom中class的方法,涉及javascript操作dom节点的使用技巧,需要的朋友可以参考下
JavaScript中的类(Class)详细介绍
10-24
在JavaScript中，类（Class）是ES6引入的一种新的语法糖，用于模拟传统的面向对象编程中的类概念，尽管JavaScript本质上是一种基于原型的面向对象语言。本文将深入探讨JavaScript中的类定义、构造函数以及类名等相关...
JavaScript操作class和style样式代码详解
10-22
主要介绍了JavaScript操作class和style样式的相关资料,需要的朋友可以参考下
详解使用HTML5的classList属性操作CSS类
09-28
`classList.toggle()`方法允许在元素上添加或移除类，根据类是否已存在。基本语法是： ```javascript element.classList.toggle(className); ``` 如果类已经存在，它会被移除；如果不存在，则会添加。此外，还...
js中class的使用
shao.zq的博客
01-12 3580
ES6中类的使用 如何创建一个类 class User{} //第一种 let User=class{} //第二种 构造函数的使用与参数初始化 class User{ constructor(name){ this.name=name; } } 静态属性的定义与使用 class request{ static host="http://127.0.0.1"; postBody(url){ return request.host+`/${url}` } } le
js中的Class类详解
热门推荐
yjwlike的博客
06-19 3万+
javascript中的类，包括静态属性私有属性继承等等
Javascript中Class的使用
最新发布
m0_72270036的博客
03-14 572
constructor构造方法，类似于构造函数，new的时候会调用，内部的this就是实例化的对象。静态属性/方法:类可以直接访问的属性和方法。私有属性/方法:类中内部访问的属性和方法。getter用于获取属性的值。setter用于设置属性的值。
Javascript定义类（class）的三种方法
zw946的专栏
09-03 992
Javascript定义类（class）的三种方法 将近20年前，Javascript诞生的时候，只是一种简单的网页脚本语言。如果你忘了填写用户名，它就跳出一个警告。 如今，它变得几乎无所不能，从前端到后端，有着各种匪夷所思的用途。程序员用它完成越来越庞大的项目。 Javascript代码的复杂度也直线上升。单个网页包含10000行Javascript代码，早就司空见惯。
js返回对象的类型方法封装
xun__xing的博客
05-11 2109
type方法封装，返回对象类型问题引出 问题引出 我们有时会遇到下面的问题： 那么我们怎样准确判断一个对象的准确类型呢，特别是遇到类数组时，这里我们介绍三种常见方法： 1.第一种: [ ].constructor / { }.constructor 2.第二种：[ ] instanceof Array / { } instanceof Array A instanceof B,看A对象原型链上，有没有B的原型 3.第三种：Object.prototype.toString.call([ ])
js 操作元素的 class 属性
艾斯比
06-05 1175
使用 js 可以操作元素的 class 属性 /* https://developer.mozilla.org/zh-CN/docs/web/api/element/classlist */ let p = document.querySelector('p') // 重新赋值 class 属性 p.className = 'class3' // 如果 class33 类值已存在, 则移除它, 否则添加它 p.classList.toggle("class33");
ES6/CLASS类
qq_54382144的博客
10-25 186
<script> /* 什么是类： 在ES6中新增加了类的概念，可以使用class关键字声明一个类， 之后以这个类来实例化对象。类抽象了对象的公共部分，它泛指 某一大类( class )对象特指某一个，通过类实例...
JavaScript 函数返回值
housir的专栏
12-24 1万+
JavaScript定义带返回值的函数有两种方法： 1. 用var function_name = function(){}方式定义，示例如下:   // 这种方式需要将var getCurrentTime定义在调用之前 var getCurrentTime = function() { var now = new Date(); var timeStr = now.getHours()
js class设置变量的魔法方法
05-05
在 JavaScript 中，可以使用特定的方法来定义类的变量，这些方法被称为“魔法方法”。...除了以上这些魔法方法，JavaScript 还提供了许多其他的方法和语法糖，可以让我们更方便地定义类和操作对象。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值