JavaScript单击按钮将页面中的所有图片替换为另一幅图片
时间: 2024-04-06 21:31:22 浏览: 71
JavaScript实现点击图片换背景
5星 · 资源好评率100%
可以使用JavaScript来实现这个功能。首先,需要获取页面中所有的图片元素,可以使用`document.getElementsByTagName('img')`来获取。然后,遍历这些图片元素,将它们的`src`属性替换为另一幅图片的URL即可。
以下是示例代码:
```javascript
// 获取所有图片元素
var images = document.getElementsByTagName('img');
// 遍历图片元素,将其`src`属性替换为另一幅图片的URL
for(var i = 0; i < images.length; i++) {
images[i].src = 'https://example.com/replace-image.jpg';
}
```
将上述代码放在一个函数中,并在页面中添加一个按钮,当按钮被单击时调用该函数即可。例如:
```html
<button onclick="replaceImages()">替换图片</button>
<script>
function replaceImages() {
// 获取所有图片元素
var images = document.getElementsByTagName('img');
// 遍历图片元素,将其`src`属性替换为另一幅图片的URL
for(var i = 0; i < images.length; i++) {
images[i].src = 'https://example.com/replace-image.jpg';
}
}
</script>
```
阅读全文