最近在做OCX控件，但这个控件并不是一打开网页就需要初始化的，而是根据需要动态创建；在控件初始化的时候需要在控件内部获取其在网页中的DOM对象；并且创建之后需要立刻调用控件的方法。
最开始的方法如下：
1 var ctrl = document.createElement('object'); 2 ctrl.classid = 'CLSID:DCC16727-7A51-47B4-B38E-B020EAAF0584'; 3 document.body.appendChild(ctrl);
这个方法在IE11中什么问题都没有；但在IE9中，控件初始化时获取不到其在网页中的DOM对象。
通过测试，直接在页面中添加相应的HTML代码是可以在控件初始化的时候获取到其在网页中的DOM对象的。
<HTML> <HEAD> <TITLE>ATL test page for object Test3</TITLE> </HEAD> <BODY> <OBJECT ID="Test3" CLASSID="CLSID:DCC16727-7A51-47B4-B38E-B020EAAF0584"></OBJECT> </BODY> </HTML>
在网上搜了搜，搜到这么一篇文章《FAQ: 如何动态创建并访问网页元素》，他的思路是在OCX中用insertAdjacentHTML方法创建。这个方法无法解决“控件初始化时获取不到其在网页中的DOM对象”这问题。
看了这篇文章的实现思路，让我想起了以前看的DOM的过桥、重排与重绘的概念（参考《高性能JavaScript DOM编程以及重排与重绘》），调用getElementById会引起过桥，过桥会引起重排与重绘。
基于这个概念，于是就想通过innerHTML创建控件，是不是就跟一上来写好HTML代码是一样的。最终测试，这个方法可行。
最终代码如下：
var div = document.createElement('div'); div.innerHTML = '<OBJECT ID="Test4" CLASSID="CLSID:DCC16727-7A51-47B4-B38E-B020EAAF0584"></OBJECT>'; document.body.appendChild(div); ctrl = document.getElementById('Test4');
如何在控件初始化时获取其在网页中的DOM对象，可参考我的另一篇文章《在OCX初始化时获取其在网页中的DOM对象》。