首页 > 代码库 > 2016.11.23

2016.11.23

2024-08-22 21:03:05   222人阅读

今天是开班的第一天，同学和老师都作了自我介绍。

下午自习，看了点js，研究了一个javascript图片库案例。

代码：

 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     <h1>Photos</h1>
14     <ul>
15         <li>
16             <a href = "../images/mayday/12.jpg" title = "mayday12" onclick ="showPic(this);mayday();return false;">mayday12</a>
17         </li>
18         <li>
19             <a href = "../images/mayday/13.jpg" title = "mayday13" onclick = "showPic(this);return false;">mayday13</a>
20         </li>
21         <li>
22             <a href = "../images/mayday/14.jpg" title = "mayday14" onclick = "showPic(this);return false;">mayday14</a>
23         </li>
24         <li>
25             <a href = "../images/mayday/15.jpg" title = "mayday15" onclick = "showPic(this);return false;">mayday15</a>
26         </li>
27     </ul>
28     <p id = "description">啦啦啦啦啦</p>
29     <a href = "http://www.example.com/" class = "mayday";>打开一个新窗口</a>
30     <img id = "placeholder" src ="../images/mayday/5.jpeg" title = "mayday5" alt = "mayday5"/>
31 </body>
32     <script>
33 //        var placeholder = document.getElementById("placeholder");
34 //        var img_src = http://www.mamicode.com/placeholder.getAttribute("src");
35 //        img_src.setAttribute("src","../images/mayday/12.jpg");
36 //        function photoPic(placeholder){
37 //
38 //        }
39         function showPic(whichpic){
40 //            var whichpic = document.getElementsByTagName("a");
41             var source = whichpic.getAttribute("href");
42             var placeholder = document.getElementById("placeholder");
43             placeholder.setAttribute("src",source); 
44 
45             var text = whichpic.getAttribute("title");
46             var description = document.getElementById("description");
47             description.firstChild.nodeValue = text;
48 
49 
50         }
51 //        function countBodyChildren(){
52 //            var body_element = document.getElementsByTagName("body")[0];
53 //            alert(body_element.childNodes.length);
54 //            
55 //
56 //        }
57 //        window.onload = countBodyChildren;
58 //        event = "javascript statements();"
59         function mayday(winURL){
60             window.open(winURL,"may","width = 550px,height = 550px");
61         }
62     </script>
63 </html>

效果：

技术分享

2016.11.23


联系
我们