编辑解释页面加载
我的HTML页面在另一个div中有一个div,两者都由id引用,并且在整个文档中都是唯一的。
<head>
<script type="text/javascript" src="myscript.js"></script>
</head>
...
<body onload=display()>
<div id="rightwork">
<div id="mychart" > </div>
</div>
...
我的JavaScript是为了在'mychart'div中写一些内容,但我无法引用它:(
问题与this one except this one is a class inside an id有关。
这是我的javascript:
function display() {
var code = "<a onclick=\"second(); return false;\" href=\"#\">Hello</a>";
document.getElementById('rightwork').innerHTML = code;
}
function second() {
console.log(document.getElementById('rightwork'));
console.log(document.getElementById('mychart'));
}
该行
document.getElementById("mychart");
返回null ...
然而,这个工作正常!
document.getElementById("rightwork");
返回预期的div。
我试过这个
document.getElementById("rightwork").getElementById("mychart");
这当然不起作用,因为getElementById(“rightwork”)返回一个元素。
那么,引用内部div的解决方案是什么?
答案 0 :(得分:3)
只需使用
window.onload = function(){
var myChart = document.getElementById("mychart");
// ... code that loads chart
}
或移动
<script type="text/javascript" src="myscript.js"></script>
到页脚,以确保在运行脚本之前加载了dom
答案 1 :(得分:1)
请您发布整个myscript.js内容。如果正确加载文档,为什么document.getElementById("mychart");
不起作用?
可能是在执行javascript时未加载<div id="mychart" > </div>
并且在此时加载了<div id="rightwork">
。
为确保文档已完全加载,请将您的<script type="text/javascript" src="myscript.js"></script>
放在html的末尾。