DOM是一种适用于多种环境和多种程序设计语言的通用型API。
如果想要把本书(JS DOM编程艺术)学到的DOM技巧运用在web浏览器以外的应用环境里,严格遵守“第1级DOM”能够让你避免与兼容性有关的任何问题;
tips:setAttribute是第1级DOM;
图片切换初级js:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>gallery</title> <style> </style> <script type="text/javascript" src="scripts/showPic.js"></script> </head> <body> <h1>Snapshots</h1> <ul> <li><a href="img/s1.jpg" onclick="showPic(this); return false" title = "A fireworks display">Fireworks</a></li> <li><a href="img/s2.jpg" onclick="showPic(this); return false"title = "A cup of black coffee">Coffee</a></li> <li><a href="img/s3.jpg" onclick="showPic(this); return false"title = "A red, red rose">Rose</a></li> <li><a href="img/s4.jpg" onclick="showPic(this); return false"title = "The famous clock">Big Ben</a></li> </ul> <img id="placeholder" src="img/s1.jpg" alt="my image gallery"> <!-- 这里是为了展示showPic里面的代码,才放进来的 <script type="text/javascript"> // function showPic(whichpic){ // var source = whichpic.getAttribute("href"); // var placeholder = document.getElementById("placeholder"); // placeholder.setAttribute(‘src‘, source); // } // </script>--> </body> </html>
应用到文档里面的JS, 通过<script>标签的src属性来引入,同时引入的JS文件里面不需要包含<script>标签;
<script src="scripts/showPic.js"></script>
时间: 2024-10-05 05:02:12