JQ addClass（追加类）、removeClass（移除类）、以及attr（获取和设置属性值）

最新推荐文章于 2025-03-15 15:58:38 发布

boonyaxnn

最新推荐文章于 2025-03-15 15:58:38 发布

阅读量2.3k

点赞数

分类专栏： Jquery

本文链接：https://blog.csdn.net/boonyaxnn/article/details/89458399

版权

Jquery 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了jQuery中用于操作元素类和属性的方法：如何使用addClass追加类，removeClass移除类，以及如何利用attr进行属性的获取和设置。addClass支持链式调用，removeClass可以删除所有类或指定类，attr则可以读取和修改元素的属性值，当属性值为空时，attr等同于删除属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、addClass：追加类，在原有内容的基础之上进行内容的追加；支持链式调用

eg：

$('button:first').click(function () {
     //  $('.box').addClass('c1').addClass('c2');
     box.className='c1';
     });

2、removeClass：移除类

PS：①不写参数，删除所有的类型

②写参数，删除指定的类

eg：

 $('button:last').click(function () {
     $('.box').removeClass('c1');
     })

3、attr

（1）获取属性值：var result = attr('属性')

$('button:first').click(function () {
         var result =  $('.box').attr('class');
         console.log(result);

         });

（2）设置属性值：jq对象.attr('属性','属性值')

PS：如果属性值为空，那么等价于删除属性

 $('button:last').click(function () {
     $('.box').attr('class','');
 });
 $('button:last').click(function () {
     $('img').attr('src','img/1.jpg');
 });

4、html

 var h1 = document.querySelector('h1');
   h1.innerHTML='哈哈哈';
 $('h1').text('你好 海世界');
 $('h1').html('你好 海世界');