イメージがブラウザに表示されないのはなぜですか？

-2

このコードでは、ブラウザで実行するとイメージは表示されません。私は、さまざまなブラウザとさまざまな方法で画像を並べ替えてみました。なぜこれが起こっているのか、私は今何日も試してきたので、これを修正する方法を教えてください。私は少しのコードをクリーンアップしましたイメージがブラウザに表示されないのはなぜですか？

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title> Traffic Light Sequence</title> 
<body> 
<h2>Manuel Traffic Light Sequence</h2> 
<img id="light" src="C:\Users\Mrs Afolabi\Documents\Computing\lights\red.gif"> 
<button type="button" onClick="changeLights()">Change Lights</button> 
<script> 
var list = [ 
    "C:\Users\Mrs Afolabi\Documents\Computing\lights\green.gif", 
    "C:\Users\Mrs Afolabi\Documents\Computing\lights\amber.gif", 
    "C:\Users\Mrs Afolabi\Documents\Computing\lights\red.gif" 
]; 

var index = 0; 

function changeLights() 
{ 
    index = index + 1; 
    if (index == list.length) index = 0; 
    var image = document.getElementById('light'); 
    image.src=list[index]; 
} 
</script> 
</body> 
</html>

出典

2016-05-03 James

：、あなたは入力のように、同じディレクトリにあるあなたが使用しますファイルをすることができます。それを％20に置き換えようとしてください –

bodyタグの前にheadタグを閉じるべきです – aldanux

<html lang="en"> 

<head> 

    <meta charset="utf-8"> 

    <title> Traffic Light Sequence</title> 
</head> 

<body> 


<h2>Manuel Traffic Light Sequence</h2> 


<img id="light" src="red.gif"> 


<button type="button" onClick="changeLights()">Change Lights</button> 


<script> 

    var list = [ 

     "red.gif", 

     "green.gif", 

     "amber.gif" 

    ]; 

    var index = 0; 

    function changeLights() { 

     index = index + 1; 

     if (index == list.length) index = 0; 

     var image = document.getElementById('light'); 

     image.src = list[index]; 

    } 
</script> 
</body> 
</html>

ありがとうございます。 full pathが画像から削除されていることに注意してください。

イメージがHTMLファイルのすぐ隣にある場合、HTMLファイルはどこに置かれても絶対パス（c:/...）は必要ありません。代わりに、相対パスを使用する必要があります。したがって、HTMLファイルがC:\Users\Mrs Afolabi\Documents\Computing\lights\index.htmlにあると仮定すると、.gifファイルを簡単に見つけることができるので、以下のコードが有効です。

出典

2016-05-03 23:11:41

あなたはまだ ''を閉じることを忘れました。 – Xufox

ありがとう、良いキャッチ。が開かれる前にブラウザがまだ開いていれば、ブラウザは自動的にを閉じます。 –

本当にありがとう、本当に助かりました。画像が表示され、コードがスムーズに実行されます:) – James

ファイルがコンピュータにいくつかのディレクトリに配置されている場合はネイティブfile://、C://などの始まり（ユーザーのコンピュータからの）URLのこの種にアクセスする権限が

（任意のWebブラウザで）...ありません私はので、フォルダ名にスペースを推測してい

src/styles.css、file.pngなど

出典

2016-05-03 23:13:13

イメージがブラウザに表示されないのはなぜですか？

答えて

関連する問題