作业16-追加和移除

最新推荐文章于 2024-07-13 15:54:45 发布

时刻的慌张

最新推荐文章于 2024-07-13 15:54:45 发布

阅读量138

点赞数

本文链接：https://blog.csdn.net/hcl430422hcl/article/details/87178104

版权


<!doctype html>
<html>
<head lang="en">
	<meta charset="UTF-8">
<title>追加和移除样式</title>
<style type="text/css" >
*{
	margin:0px;
	padding:0px;
	font-size:14px;
	font-family:"微软雅黑";
	line-height: 28px;;
}
.title {font-size:14px; color:#03F; text-align: center; }
.text{ padding:10px;}
.content {background-color:#FFFF00; }
.border {border:1px dashed #333; }
</style>

</head>
<body>

 <h2 class="title" >jQuery操作CSS</h2>
 <p class="text">
	 css()设置或返回样式属性<br>
	 addClass()增加一个或多个类<br>
	 removeClass()移除一个或多个类
 </p>
 
 <script src="js/jquery-1.12.4.js" ></script>
 <script>
	 $(document).ready(function(){
		 $("h2").mouseover(function() {
			 $("p").addClass("content border");
		 });
		 $("h2").mouseout(function() {
			 $("p").removeClass("text content");
		 });
		
           
               /*   $("h2").click(function() {
			 $("p").toggleClass("content border");
		 });
            
 */
	 });

 </script>
</body>
</html>