如何解决.... js的标题
尝试更改图像,但遇到了一些麻烦。到目前为止,这就是我所拥有的。当我单击操作时,图像不会改变。
document.getElementById('action').addEventListener('click',function() {
document.getElementById("01.jpg").src = "02.jpg";
})
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<h1>Header 1 </h1>
<img id="photo" src="01.jpg" />
<br/>
<br/>
<a id="action" href="#">Click Me to Modify This Page</a>
</body>
</html>
解决方法
您在这里有一个错误-document.getElementById ("01.jpg")
。您必须提供ID-photo
而不是图像。
document.getElementById('action').addEventListener('click',function() {
document.getElementById("photo").src = 'https://sun9-32.userapi.com/impf/c824201/v824201969/173424/ayWCFmi538s.jpg?size=200x0&quality=90&sign=b461a01af900c4374512c2b13455c25d&ava=1';
})
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<h1>Header 1 </h1>
<img id="photo" src="01.jpg" />
<br/>
<br/>
<a id="action" href="#">Click Me to Modify This Page</a>
</body>
</html>
,
在document.getElementById中使用图像的ID,而不是图像名称。
document.getElementById('action').addEventListener('click',function() {
document.getElementById("photo").src = "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQGLpUYrlREGy0letrNu1q-Wl90fF8crtN7mg&usqp=CAU";
})
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<h1>Header 1 </h1>
<img id="photo" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSqwJv6wgZh530ZXxBE2xeui6UtiJK2Uu-6UA&usqp=CAU" />
<br/>
<br/>
<a id="action" href="#">Click Me to Modify This Page</a>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。