JavaScript学习基本语法

来源：互联网发布：泸州市网络问政平台编辑：程序博客网时间：2024/05/16 01:08
一：添加图片的实例程序        要求 点击超链接能够实现跳转到一张图片，到一张图片在本页显示的程序 其中各个文件都在一个文件夹下，根据路径建立在文件夹下html程序<!doctype html><html lang="en"> <head>  <meta charset="UTF-8">  <title>Image Gallery</title>  <link rel="stylesheet" href="styles/layout.css" media="screen"> </head> <body>    <h1>Snapshots<h1><ul>  <li>    <a href="images/fireworks.jpg" onclick="showPic(this);return false;" title="A fireWorks display">Fireworks</a>  </li>  <li>    <a href="images/coffee.jpg" onclick="showPic(this);return false;" title="A cup of black coffee">Coffee</a>  </li>  <li>    <a href="images/rose.jpg" onclick="showPic(this);return false;" title="A red red rose">Rose</a>  </li>  <li>    <a href="images/bigben.jpg"onclick="showPic(this);return false;"  title="The famous clock">Big Ben</a>  </li></ul><img id="placeholder" src="images/placeholder.gif" alt="my image gallery">    <p id="description">Choose an image.</p><script type="text/javascript" src="scripts/showPic.js"></script> </body></html>javaScript程序：function showPic(whichpic){  var source=whichpic.getAttribute("href");  var placeholder=document.getElementById("placeholder");  placeholder.setAttribute("src",source);  var text=whichpic.getAttribute("title");  var description=document.getElementById("description");  description.firstChild.nodeValue=text;}css程序：body{  font-family:"Helvetica","Arial",serif;  color:#333;  backgroud-color:#ccc;  margin:1em 10%}h1{  color: #333;  background-color:transparents;}a{  color:#c60;  background-color:transparents;  font-weight:bold;  text-decoration:none;}u1{  padding:0;}li {  float:left;  padding:1em;  list-style:none}img{  display:block;  clear:both;}
0 0
JavaScript学习 基本语法

JavaScript学习基本语法
