jquery addClass() 和removeClass() 被选元素添加类名删除类名class属性的使用
1、addClass() 方法向被选元素添加一个或多个类名。
该方法不会移除已存在的 class 属性，仅仅添加一个或多个类名到 class 属性。
提示：如需添加多个类，请使用空格分隔类名。
2、removeClass() 方法从被选元素移除一个或多个类。
注意：如果没有规定参数，则该方法将从被选元素中删除所有类。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
P{
float: left;
width: 150px;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 30px;
color: white;
background: darkmagenta;
margin: 10px;
}
p.cur{
color: black;
background: blue;
font-size: 50px;
}
</style>
<script src="../tu/jquery-1.11.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('p').click(function(){
$(this).css({'background':'blue','color':'black','font-size':'50px'}).siblings('p').css({'background':'darkmagenta','color':'white','font-size':'30px'})
// 另一种方法 点击谁给谁加个'cur'的class样式 remove删除 兄弟元素的cur样式
$(this).addClass('cur').siblings('p').removeClass('cur');
})
})
</script>
</head>
<body>
<p class="cur">1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
</body>
</html>
原文链接：https://www.qiquanji.com/post/7069.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
版权声明
本文仅代表作者观点，不代表本站立场。
本文系作者授权发表，未经许可，不得转载。
