前提・実現したいこと
ボタンを押すとそれに該当する画像を表示させる。
発生している問題・エラーメッセージ
ボタンを押しても変化なし
該当のソースコード
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>test</title> <style> div { padding: 0.5em;/*文字周りの余白*/ color: #010101;/*文字色*/ background: #eaf3ff;/*背景色*/ border-bottom: solid 3px #516ab6;/*下線*/ text-align: center;/*真ん中寄せ*/ } body { background: #e4af83; } </style> </head> <body> <div> <h1>test</h1> </div> <p>Escape from tarkov</p> <script> var img; function sampleimg1(){ img = document.getElementById("image_file"); img.src = "img/sample1.png"; } function sampleimg2(){ img = document.getElementById("image_file"); img.src = "img/sample2.png"; } function sampleimg3(){ img = document.getElementById("image_file"); img.src = "img/sample3.png"; } function sampleimg4(){ img = document.getElementById("image_file"); img.src = "img/sample4.png"; } function sampleimg5(){ img = document.getElementById("image_file"); img.src = "img/sample5.png"; } function sampleimg6(){ img = document.getElementById("image_file"); img.src = "img/sample6.png"; } function sampleimg7(){ img = document.getElementById("image_file"); img.src = "img/sample7.png"; } </script> <input type="button" onclick="sampleimg1()" value="Factory"> <input type="button" onclick="sampleimg2()" value="Customs"> <input type="button" onclick="sampleimg3()" value="Woods"> <input type="button" onclick="sampleimg4()" value="Shoreline"> <input type="button" onclick="sampleimg5()" value="Interchange"> <input type="button" onclick="sampleimg6()" value="The Lab"> <input type="button" onclick="sampleimg7()" value="Reserve"> <br><br> </body> </html>
試したこと
今日HTMLを始めて何が間違っているのかさっぱりです。今後の成長のためににご教授ください。
恐らく画像をうまく取得できていないがために失敗していると思います。
補足情報(FW/ツールのバージョンなど)
VScodeで書きました。HTML5
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2021/07/26 07:02