js怎么通过按钮切换图片

在JavaScript中，通过按钮切换图片通常涉及到HTML、CSS和JavaScript的结合使用。基本思路是使用HTML来创建按钮和图片，CSS用于样式设置，而JavaScript则用来监听按钮点击事件并切换图片。下面是一个简单的实现方式：

1. 首先，在HTML中定义图片和按钮：

<img id="image" src="image1.jpg" alt="可切换的图片" />
<button onclick="changeImage()">切换图片</button>

2. 接下来，在JavaScript中定义`changeImage`函数，该函数会在按钮点击时被触发，用于切换图片：

function changeImage() {
    var img = document.getElementById('image');
    if(img.src.match('image1.jpg')) {
        img.src = 'image2.jpg'; // 如果当前图片是image1.jpg，则切换为image2.jpg
    } else {
        img.src = 'image1.jpg'; // 如果当前图片不是image1.jpg，则切回image1.jpg
    }
}

3. 最后，可以添加一些CSS来美化按钮或者图片，但这不是必须的：

button {
    /* 样式设置 */
}

这样，当用户点击按钮时，`changeImage`函数会被调用，根据当前图片的`src`属性，选择切换到另一张图片。