<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>css属性(专门用于class属性设置)</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style type="text/css">
.c1{color:red;}
.c2{font-size:50px;}
.c3{width:100px;height:100px;border:1px solid red;}
</style>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
/*
addClass //添加一个样式
removeClass //移除一个样式
toggleClass //切换样式(如果有就移除，如果没有就添加)
hasClass //判断是否具有某个样式
*/
window.onload=function(){
$('#btnOk').click(function(){
//添加c3样式
//$('div').addClass('c3');
//移除一个样式
//$('div').removeClass('c1');
//切换样式(如果有就移除，如果没有就添加)
//$('div').toggleClass('c3');
//判断是否具有某个样式
if($('div').hasClass('c1')){
alert('具有c1属性');
};
});
};
</script>
</head>
<body>
<div class='c1 c2 '>test</div>
<hr />
<input type="button" id='btnOk' value='确定' />
</body>
</html>