getElementById在运行时动态创建元素的位置

Question

我在运行时使用innerHTML标记创建了一个对象,现在我想通过使用getElementById来访问这个元素,当我访问元素时它返回NULL值.请建议我任何方向,以便我能够实现这一目标,

以下是我正在使用的以下代码提示

在HTML中

<div id="web">
<object id="test"></object>
</div>

在JS中

document.getElementById("web").innerHTML="<object id='test2'></object>";
.
.
var obj = document.getElementById("test2");

这里obj返回null值.

Answer 1

您是否为新创建的元素分配了ID？您是否将元素插入文档树(使用appendChild或insertBefore)？只要元素未插入DOM,就无法使用它来检索它document.getElementById.

元素创建示例:

var myDiv = document.createElement('div');
myDiv.id = 'myDiv';
document.body.appendChild(myDiv);
document.getElementById('myDiv').innerHTML = 'this should have worked...';

[ 编辑 ]考虑到以后提供的代码,第三个问题出现了:是你的脚本位于HTML页面的底部(结束前右</body>标签)？如果它位于文档的标题中,则可以在完全呈现文档树之前运行脚本.如果您的脚本必须位于文档的标题中,则可以使用加载处理程序在呈现文档后运行它:

window.onload = function(){
  document.getElementById("web").innerHTML='<object id="test2"></object>';
  // [...]
  var obj = document.getElementById('test2');
};