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

时间:2015-09-04 09:56:54

标签: javascript html getelementbyid

编辑解释页面加载

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

2 个答案:

答案 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的末尾。