前端写的一个图片库（art gallery）

最新推荐文章于 2024-05-13 01:47:56 发布

kitty ball

最新推荐文章于 2024-05-13 01:47:56 发布

阅读量1.1k

点赞数

分类专栏：前端文章标签： html 前端 javascript

本文链接：https://blog.csdn.net/weixin_35898776/article/details/53328971

版权

前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

初次写关于js的东西
之前都是把script的东西直接放到html的文本里面，近日按第一次写了一个js然后通过文件的方式放到html的里面

Html的代码

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>Image</title>    
    </head>
    <body>
        <h1>Snashots</h1>
        <ul>
            <li>
                <a href="1518aa12ee9284ce5d45d818364740ac.jpg" onclick="showPic(this);return false;" title="Wine Party">wine</a>
            </li>
            <li>
                <a href="21296024e76ff4f17624bbda7dd4125e.jpeg" onclick="showPic(this);return false;"title="pretty gril">pretty gril</a>
            </li>
            <img id="placeholder" src="images/placeholder.gif" alt="my art gallery"/>
                    <script type="text/javascript" src="scripts/showPic.js"></script>
        </ul>
    </body>
</html>

javascript文件的代码

<script>
            function showPic(whichpic){ 
                var source =whichpic.getAttribute("href");
                var placeholder= document.getElementById("placeholder");
                placeholder.setAttribute("src",source);
            }
</script>