JS DOM getAttribute()
JS DOM getAttribute()
提问于 2016-06-01 14:36:35
我试图使用DOM和JS获取属性值，但无法让代码运行。为什么？
<!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>回答 2
Stack Overflow用户
回答已采纳
发布于 2016-06-01 14:38:31
HTML (DOM)的标记尚未加载，在执行JS代码时尚未显示。这就是为什么您要么需要将您移动到HTML代码下面，如下所示：
<!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>Stack Overflow用户
发布于 2016-06-01 14:42:09
您正在尝试获取尚未加载的元素的属性，尝试将js放入就绪函数中，以便在DOM元素存在之后触发它：
document.addEventListener('DOMContentLoaded', function() {
var x = document.getElementById("sw").getAttribute("src");
alert("src "+ x);
document.getElementById("sw").innerHTML ="src "+ x;
});或者，您可以将<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>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37571744
复制相关文章
相似问题
腾讯云开发者
