JS DOM getAttribute（）

DOMとJSを使用して属性値を取得しようとしていますが、コードを実行できません。どうして？JS DOM getAttribute（）

<!DOCTYPE html> 
<HTML> 
    <HEAD> 
    <SCRIPT> 

     var x = document.getElementById("sw").getAttribute("src"); 
     alert("src "+ x); 

     document.getElementById("sw").innerHTML ="src "+ x; 
    </SCRIPT> 
    </HEAD> 

    <BODY> 
    <FORM> 
     <IMG id="sw" src="photo.jpg"/> 
    </FORM> 
    </BODY> 
</HTML>

出典

2016-06-01 v8rs

HTML（DOM）のタグはまだロードされておらず、JSコードが実行された時点ではまだ表示されていません。

<!DOCTYPE html> 
<HTML> 
<HEAD> 

</HEAD> 

<BODY> 
<FORM> 
<IMG id="sw" src="photo.jpg"/> 
<SCRIPT> 

var x = document.getElementById("sw").getAttribute("src"); 
alert("src "+ x); 

document.getElementById("sw").innerHTML ="src "+ x; 
</SCRIPT> 
</BODY> 
</HTML>

またはあなたがそうのようなDOMLoadedイベントのイベントハンドルを追加する必要があります：

<SCRIPT> 
document.addEventListener("DOMContentLoaded", function(event) { 

    var x = document.getElementById("sw").getAttribute("src"); 
    alert("src "+ x); 

    document.getElementById("sw").innerHTML ="src "+ x; 
}); 
</SCRIPT>

出典

2016-06-01 14:38:31 shershen

あなたが属性を取得しようとしているあなたはどちらかそうのようなあなたのHTMLコードの下にあなたを移動する必要がある理由ですそれはちょうどDOM要素の存在後にトリガされますので、まだ準備ができて関数内であなたのjsを配置しようがロードされていない要素の：

document.addEventListener('DOMContentLoaded', function() { 
    var x = document.getElementById("sw").getAttribute("src"); 
    alert("src "+ x); 

    document.getElementById("sw").innerHTML ="src "+ x; 
});

それとも、右BEFあなた<script>コードを置くことができ閉じるタグ</body>。

これが役に立ちます。

<!DOCTYPE html> 
 
<HTML> 
 
    <HEAD> 
 
    <SCRIPT> 
 
     document.addEventListener('DOMContentLoaded', function() { 
 
     var x = document.getElementById("sw").getAttribute("src"); 
 
     alert("src "+ x); 
 

 
     document.getElementById("sw").innerHTML ="src "+ x; 
 
     }); 
 
    </SCRIPT> 
 
    </HEAD> 
 

 
    <BODY> 
 
    <FORM> 
 
     <IMG id="sw" src="photo.jpg"/> 
 
    </FORM> 
 
    </BODY> 
 
</HTML>

出典

2016-06-01 14:42:09

答えて

関連する問題