1
HTML、JavaScript、CSSを使用してWebページを作成しようとしていますが、画像ファイルが表示されません。私は、HTMLファイルが入っているのと同じフォルダに私のimgフォルダを持っています。 デコレーションされていないツリーを表示したいときに、ボタンをクリックして他のイメージを表示しても、HTMLファイルから画像を表示できません
<!DOCTYPE html>
<html>
<title>
Christmas
</title>
<body>
<h1>Lets decorate this chritmas tree!</h1>
<button onclick="document.getElementById('xmasTreeImage').src='decoratedtree.jpg'">Decorate the tree</button>
<img id="xmasTreeImage" alt="Can't display" src="undecoratedtree.jpg" style="width:100px">
<button onclick="document.getElementById('xmasTreeImage').src='undecoratedtree.jpg'">Take away the decorations</button>
</body>
</html>
アップデート：私は、正確なディレクトリに追加した場合
<!DOCTYPE html>
<html>
<title>
Christmas
</title>
<body>
<h1>Lets decorate this chritmas tree!</h1>
<button onclick="document.getElementById('xmasTreeImage').src='C:\Users\Me\Documents\ChristmasWebProject/decoratedtree.jpg'">Decorate the tree</button>
<img id="xmasTreeImage" alt="Can't display" src="C:\Users\Me\Documents\ChristmasWebProject/undecoratedtree.jpg" style="width:100px">
<button onclick="document.getElementById('xmasTreeImage').src='C:\Users\Me\Documents\ChristmasWebProject/undecoratedtree.jpg'">Take away the decorations</button>
</body>
</html>
それは、画像を表示するが、確かにこれを行うには、より効率的な方法はありますか？また、ボタンをクリックすると何も表示されず、ボタンをクリックする前に画像が表示されます。
ここでこの画像パスを確認する必要があります。これは適切なローダーですか？そうではありませんか？ –
はいこれはHTMLファイル@ carambaと同じディレクトリにあります – Jill
Web用の画像を開いて保存できますか？頻繁に起こることはありませんが、イメージファイルのアクセス許可を確認してください。または画像をブラウザにドラッグアンドドロップし、HTMLファイルのURLからパスをコピー/ペーストします。 – caramba