1.css()
方法描述：获取匹配元素集合中的第一个元素的样式属性的计算值或设置每个匹配元素的一个或多个CSS属性。
需求描述：设置div的背景颜色为红色，字体颜色为白色
<div>我是div</div> $('div').css({ 'background': 'red', 'color': 'white' });
2.需求描述：获取div的背景颜色和字体颜色并输出
<div style="background: red;color: white">我是div</div> console.log($('div').css('background')); console.log($('div').css('color'));
3. addClass()
方法描述：为每个匹配的元素添加指定的样式类名。
需求描述：为所有的li添加样式”beauty“
.beauty { font-weight: bold; font-size: 18px; color: coral; }
<ul> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> <li>列表项4</li> </ul>
$('li').addClass('beauty');
4. hasClass()
方法描述：确定任何一个匹配元素是否有被分配给定的样式类。
需求描述：判断p标签是否包含”beauty“的样式
.beauty { font-weight: bold; font-size: 18px; color: coral; }
<p class="beauty"></p>
console.log($('p').hasClass('beauty')); .hide { width: 100px; height: 100px; display: none; }
5. toggleClass()
方法描述：为匹配的元素集合中的每个元素上添加或删除一个或多个样式类，取决于这个样式类是否存在。
注意：如果存在（不存在）就删除（添加）一个样式类
需求描述：当单击按钮的时候，隐藏div，再次单击按钮的时候，显示div
.hide { width: 100px; height: 100px; display: none; }
<button>按钮</button> <div>我是div</div>
$('button').click(function () { $('div').toggleClass('hide'); });
