Question

编辑解释页面加载

我的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的解决方案是什么？

Answer 1

只需使用

window.onload = function(){
   var myChart = document.getElementById("mychart");
   // ... code that loads chart
}

或移动

<script type="text/javascript" src="myscript.js"></script>

到页脚，以确保在运行脚本之前加载了dom

Answer 2

请您发布整个myscript.js内容。如果正确加载文档，为什么document.getElementById("mychart");不起作用？

可能是在执行javascript时未加载<div id="mychart" > </div>并且在此时加载了<div id="rightwork">。

为确保文档已完全加载，请将您的<script type="text/javascript" src="myscript.js"></script>放在html的末尾。

使用JavaScript在另一个div id中获取div id

2 个答案: