我們通過createPopup建立的popup對象包含了一個document屬性，document其實就是html的容器。MSDN說：建構popup的DHTML可以存儲在其父document或其他的document中。這個話真是讓人不明白，其實就是說我們可以使用popup.document.body去append别的DHTML内容，比如：popup.document.body.innerHTML
= '...'或popup.document.body.appendChild(...)。這裡又遇到了popup的一些怪異的特性，我們發現：
var win = window;
var doc = win.document;
var popup = win.createPopup();
var popdoc = popup.document;
var popwin = popdoc.parentWindow;
var popwindoc = popwin.document;
結果popdoc !=
popwindoc，這都沒什麼了，不等就不等把，可是當我們調用popdoc.write和popwindoc.write後，去發現執行結果是一樣的，即資料被寫入了popup視窗中。不過還好這裡也不影響我們的菜單實作，就是怪異罷了。
上面的popdoc和popwindoc引用雖然不同，不過執行效果卻相同，都能按我們預期的效果修改popup。可是接下來我們發現popup.document.body的appandChild方法和innerHTML屬性向popup裡添加DHTML内容的效果就大不同了，這個不同和給我帶了很多的麻煩，使菜單的邏輯資料(JavaScript建構的菜單類)與UI表現(HTML元素建構的菜單的可視外觀)以及它們之間的事件傳遞變得亂糟糟的
。
我們有兩個方法向popup裡添加html内容，一個是使用popup.document.body的innerHTML直接把html代碼賦到body中去；另一個辦法是使用popup.document.body的appendChild方法對dom進行操作。這裡要注意，必須使用popup自己的document對象來建立DHTML元素，才能使用appendChild來添加。比如我上面代碼中的popdoc和popwindoc雖然引用不相等，但是确實是popup的doucment對象，使用他們來createElement得到的對象，才能被appendChild到popup裡去。如果是使用doc來createElement得到的對象，在popup.docuemnt.body上去appendChild會得到一個運作時錯誤：Error:
Invalid argument.。
為什麼啰裡啰唆說了半天appendChild方法和innerHTML屬性呢？因為他們各有各的好處，如果使用appendChild這種方式，我們可以在建立菜單類的資料的時候，使菜單的邏輯資料(JavaScript實作的類)和UI顯示元素(HTML)之間彼此引用起來，這樣在我們處理菜單事件的時候，會使程式和整個執行結構都變得比較清晰(這個在菜單處理事件的時候，我會再詳細說)。這樣一說，我們當然應該使用這種方法來append我們的菜單的内容了，可是我們又遇到了popup一個讓人抓狂的問題
。使用popup.document.body.appendChild方法把DHTML内容導入後，我們事先賦給DHMTL元素的屬性有些會失效，其中包括nowrap,
onstartselect,
rules等，這三個屬性的失效，十分嚴重的影響了菜單UI的呈現，下圖就是使用appendChild後popup視窗裡得到的效果，左邊是在IE裡我們希望的正确效果。
是以不得不放棄了appendChild方法的使用，改用popup.document.body.innerHTML直接指派html的辦法，可是這種方法就不能在對象引用關系上建立菜單邏輯資料和UI元素之間的聯系，因為對象引用雖然能被存儲在html元素的屬性中，可是當以字元串方式來複制html元素時，html元素上attach的事件和屬性裡存放的對象引用就都丢失了，是以隻能使用另外的辦法來關聯他們。于是我們實作了一個叫__MenuCache__的類似hash
table的全局類來管理它們之間的一一對應關系。
本文轉自部落格園鳥食軒的部落格，原文連結：http://www.cnblogs.com/birdshome/，如需轉載請自行聯系原部落客。