章节
问答
课签
笔记
评论
占位
占位

jQuery的属性与样式之增加样式.addClass()

通过动态改变类名(class),可以让其修改元素呈现出不同的效果。在HTML结构中里,多个class以空格分隔,当一个节点(或称为一个标签)含有多个class时,DOM元素响应的className属性获取的不是class名称的数组,而是一个含有空格的字符串,这就使得多class操作变得很麻烦。同样的jQuery开发者也考虑到这种情况,增加了一个.addClass()方法,用于动态增加class类名

.addClass( className )方法

  1. .addClass( className ) : 为每个匹配元素所要增加的一个或多个样式名
  2. .addClass( function(index, currentClass) ) : 这个函数返回一个或更多用空格隔开的要增加的样式名

注意事项:

.addClass()方法不会替换一个样式类名。它只是简单的添加一个样式类名到元素上

简单的描述下:在p元素增加一个newClass的样式

<p class="orgClass">
$("p").addClass("newClass")

那么p元素的class实际上是 class="orgClass newClass"样式只会在原本的类上继续增加,通过空格分隔

任务

在代码编辑器中第61行填写相应代码

addClass

在代码编辑器中第71行填写相应代码

addClass
?不会了怎么办
||
1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最新回答 / Coding青天
查找所有DIV里面 类名含有imooc的 div,去掉之后就查不到了,你检查一下看看!

已采纳回答 / AD高飞
优先级不一样~

最赞回答 / 0_荒糖落_0
<div class="right">        <div class="aa bb imooc">class有三个样式aa bb imooc,b可以指向第二个bb,z没有在其中,换句话说,里面并没有z这个字母

最赞回答 / hwg1996
indexOf("c")是用于返回某个指定的字符串值在字符串中首次出现的位置。这个c在imooc中是存在的。你换个z试试

已采纳回答 / Ankkaya
"!==" 既比较数据的值,也比较数据的类型。属于严格运算符。这里用“!==”是javascript规定当然你要用 “!=”程序也能正常运行

已采纳回答 / 最爱是雪碧_球球
相当于这个函数是给一个元素添加了两个样式,比如<a class="h1 h2"></a>这里是用了两个样式的(h1和h2);自己可以适当测试一下

最赞回答 / 枫叶咚咚咚
选择器$('div')是获取到所有div标签对象,然后对每个标签对象执行.addClass(function(index,className){……}),也就是查看每个div标签的className是否包含'imooc',如果包含,就再为这个标签增加一个值为'imoocClass'的新className。$(this)在这里是当前正在查看的div标签。

最赞回答 / 冷寒轩111
楼上说的最后一句是错的,$("div[className='imooc']").addClass("imoocClass"),首先这里的div没有className属性,其次,人家的值也不是imooc,所以不能用 = 应该是$("div[class*='imooc']").addClass("imoocClass") 或者是 $("div[class~='imooc']").addClass("imoocClass")最后 我想说的是 那些给他点赞的人,你们只是看而不去实际写一下看效果吗?

最赞回答 / 慕婉清741579
indexOf() 方法可返回imooc在字符串中首次出现的位置,如果imooc没有出现,则返回 -1。这个判断是className里面有没有imooc的意思

最赞回答 / Sen丶dream
添加的是类名 查找的也是类名原来前两个方格的类名是aaron$('.left div').addClass('newClass')在执行上述语句后变为aaron newClass所以前两个变红

已采纳回答 / 慕丝0026560
className.indexOf('imooc')是检索字符串"imooc"在字符串className中首次的位置,返回值就是字符串的位置,如果检索完毕后发现字符串并没有出现,那么返回值为-1。这句是判断字符串"imooc"是否在className中,如果不在,则执行代码块中的代码。

最赞回答 / 冷寒轩111
        $("div").addClass(function(index,className) {            if(-1 !== className.indexOf('imooc')){                return 'imoocClass';            }        });亲测有效

最新回答 / 凌V寒
cxlassName应该是className吧?function(index,className)获取的是添加前的class,if(-1 !== className.indexOf('imooc'))如果这个class中有imooc,才addClass一个imoocClass,你需要再次获取className他才能变成bb cc imooc imoocClass
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言