日夜不得闲

  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理
思维导图：第七天的记录 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 5     <title>网页标题</title>
 6     <meta name="keywords" content="关键字列表" />
 7     <meta name="description" content="网页描述" />
 8     <link rel="stylesheet" type="text/css" href="" />
 9     <style type="text/css"></style>
10     <script type="text/javascript"></script>
11 </head>
12 <body>
13     <a href="http://www.jd.com"><img src="images/jd1.png" id="changeImg"></a>
14     
15     <script type="text/javascript">
16         var imgObj = document.getElementById("changeImg");
17         //get Element By Id  通过id的属性值来获取元素
18         //*事件
19         //当鼠标经过时 onmouseover
20         //当鼠标离开时 onmouseout
21         //当鼠标点击时 onclick
22         imgObj.onmouseover = function(){
23             //实现什么功能
24             imgObj.src = "images/jd2.png";
25         }
26 
27         imgObj.onmouseout = function(){
28             imgObj.src = "images/jd1.png";
29         }
30         //imgObj.onmouseover = function(){
31             //window.alert("传智播客！");
32         //}
33         
34     </script>
35 </body>
36 </html>

鼠标经过时切换图片，鼠标点击可以通过超链接进入京东首页

 

posted on 2016-11-21 21:29  日夜不得闲  阅读(193)  评论(1)    收藏  举报