DOM节点

最新推荐文章于 2024-11-15 15:16:11 发布

原创最新推荐文章于 2024-11-15 15:16:11 发布 · 516 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript知识点专栏收录该内容

13 篇文章

订阅专栏

学习Dom做的练习，这是程序运行时的界面，

点击显示按钮，就会变成另一张图片，下面的是效果图：

下面是程序的代码

、、、、、、、、、、、、、、图片显示
        var num = 0;
        function showinfo() {
            num++;
            if (num % 2 == 0) {
                document.getElementById('img1').setAttribute('src', 'images/1.jpg');
            }
            else {
                document.getElementById('img1').setAttribute('src', 'images/2.jpg');
              }
        }

、、、、、、、、、、、图片轮换、、、、、、、、、、、、、
        var imgnumb = 1;
        function showimg() {
            imgnumb++;
            document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');
            if (imgnumb == 8) {
                imgnumb = 0;
            }
        }

、、、、、、、、、、、、、停止、、、、、、、、、、、、、、、
        var id;
        function stop() {
            clearInterval(id);
         }
    </script>
</head>
<body>
    <img src="images/1.jpg" class="style1" id="img1" alt="" width="200px"/>
    <input id="Button1" type="button" value="显示" onclick="showinfo();"/>
    <input id="Button2" type="button" value="图片轮换" onclick="showimg();"/>
    <input id="Button3" type="button" value="停止" onclick="stop();"/>
</body>