1. 首页
  2. 游戏开发
  3. 其他
  4. JavaScript实现点击按钮切换图片,附完整源码

JavaScript实现点击按钮切换图片,附完整源码

上传者: 2023-07-30 09:14:22上传 RAR文件 134.49KB 热度 18次

JavaScript实现点击按钮切换图片的方法非常简单。只需要给按钮添加一个onclick事件,然后在事件处理函数中切换图片的src属性即可。以下是实现该功能的完整源码示例:

html>

<html>
<head>
  <meta charset="utf-8"/>
  <title>JavaScript点击按钮切换图片title>
  <style>
    img {
      width: 200px;
      height: 200px;
    }
  style>
head>
<body>
  <img id="myImage" src="image1.jpg"/>
  <br/>
  <button onclick="changeImage()">点击切换button>

  <script>
    function changeImage() {
      var image = document.getElementById("myImage");
      if (image.src.match("image1.jpg")) {
        image.src = "image2.jpg";
      } else {
        image.src = "image1.jpg";
      }
    }
  script>
body>
html>
用户评论