练习2：制作非缘勿扰页面特效的源代码
使用 jQuery 的练习 要求如下:
使用jQuery 之前记得去下载一个jquery的架包,而我使用的是jquery-3.2.1版本,放在WebRoot包下,可以自己创建一个包.
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <title>制作非缘勿扰页面特效 </title> 7 <script type="text/javascript" src="js/jquery-3.2.1.js" ></script> 8 <script type="text/javascript"> 9 //创建一个页面加载事件 10 $(function() { 11 //导演字体进行加粗 12 $("[class='dy']").css("fontweight:boid"); 13 $("b").css({"color":"blue","fontSize":"36xp"}); 14 //添加单击事件 15 $("[alt='收藏本片']").click(function(){ 16 //js 17 alert("收藏"); 18 }); 19 20 21 }); 22 </script> 23 <style type="text/css"> 24 .main{ 25 width:500px; 26 } 27 .left{ 28 width:200px; 29 float:left; 30 } 31 .right{ 32 width:300px; 33 float:left; 34 } 35 </style> 36 37 38 </head> 39 <body> 40 <div class='main' > 41 <div class='left' id="ccc"> 42 <img src="images/pic.gif" /> 43 <br/><br/><br/><br/> 44 <img src="images/col.gif" alt="收藏本片" /> 45 </div> 46 <div class='right'> 47 <dl> 48 <dt><b>非缘勿扰</b></dt> 49 <dd> 50 <p> 51 <strong>主演：</strong><span>苏有朋/秦岚/傅艺伟等</span> 52 </p> 53 <p> 54 <strong class='dy'>导演：</strong><span>赖水清</span> 55 </p> 56 <p> 57 <strong id='bq'>标签：</strong><span><a>苏有朋</a> <a> 国产电视剧</a> <a>2013</a> <a>连续剧</a></span> 58 </p> 59 <p> 60 <strong>剧情：</strong><span>当代都市，大年女刘林、杨阳都在寻找自己的如意郎君，刘林偶遇陆氏房地产总裁路西诺，两人成了欢喜冤家，遭到暗恋西诺的丁娟的嫉恨。。。<a href="#">点击了解更多 </a></span> 61 </p> 62 </dd> 63 </dl> 64 <img src="images/btn.gif"/> 65 </div> 66 </div> 67 68 </body> 69 </html>
