为了账号安全,请及时绑定邮箱和手机立即绑定

....js的标题

....js的标题

慕仙森 2023-01-06 16:04:15

试图改变形象,但遇到了一些麻烦。这是我到目前为止所拥有的。当我点击动作时,图像不会改变。


document.getElementById('action').addEventListener('click', function() {


    document.getElementById("01.jpg").src = "02.jpg"; 


    

})

<!DOCTYPE html>

<html>

    <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>


查看完整描述

2 回答

?
ITMISS

TA贡献1577条经验 获得超8个赞

在 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>

  <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>


查看完整回答
反对 回复 2023-01-06
?
慕尼黑8549860

TA贡献1579条经验 获得超11个赞

你在这里有一个错误 - 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>

    <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>


查看完整回答
反对 回复 2023-01-06
  • 2 回答
  • 0 关注
  • 12 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信