您的位置:首页 > Web前端 > JQuery

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

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

.addClass(className)方法

1.addClass(className):为每个匹配元素所要增加的一个或多个样式名

2.addClass(function(index,currentClass)):这个函数返回一个或更多用空格隔开的要增加的样式名

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

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

<pclass="orgClass">
$("p").addClass("newClass")
那么p元素的class实际上是class="orgClassnewClass"样式只会在原本的类上继续增加,通过空格分隔

jQuery的属性与样式之删除样式.removeClass()

jQuery通过.addClass()方法可以很便捷的增加样式。如果需要样式之间的切换,同样jQuery提供了一个很方便的.removeClass(),它的作用是从匹配的元素中删除全部或者指定的class

.removeClass()方法

.removeClass([className]):每个匹配元素移除的一个或多个用空格隔开的样式名

.removeClass(function(index,class)):一个函数,返回一个或多个将要被移除的样式名

注意事项

如果一个样式类名作为一个参数,只有这样式类会被从匹配的元素集合中删除。如果没有样式名作为参数,那么所有的样式类将被移除


                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: