背景
近日將D blog遷移到用埋Blogger Server去host,於搬Travel Blog其間,就趁機執一執個Map effect的Javascript,等我可以用blogger的Layout中的Html/Javascript widget就可以加到同initialize到D visual effect.
那自然,一些牽涉到加一些新DOM element的event便改了在[body]入面行,如我有一個function做:
function createObject()
{
var newDOMObj = document.createElement("div");
...
document.body.appendChild(newDOMObj);
}
我就打算用下面的code去行呢個function
[body]
...
[script]createObject();[/script]
...
[/body]
自己一向用Firefox 3同Chrome做development,試過,無問題wor,點知一去到IE,無論係IE6定IE7,都出fatal error,連頁面都出唔到。
appendChild
經過Google一番後就發現,係[body]入面做appendChild時,因為個DOM structure跟本未ready,因此如果在那時就新加一些element落個DOM入面的話,就會有可能有問題(今次來說,就是IE有問題)。
Solution
自己因為工作上會用到YUI,結果我就用了YUI Event Utility 中的onDomReady去解決呢個問題,如:
[body]
...
[script]YAHOO.util.Event.onDOMReady(createObject);[/script]
...
[/body]
在更改以後,因為body.appendChild的動作會被延後到整個[body] tag render好後做 (實際上,等同將createObject()變成再body.onLoad時執行,因此問題就得以解決了。
最後,本人coding經驗尚未算深,如有錯漏,敬請指正~
註:因為Blogger唔可以係文章入面由〈body〉呢個tag,因此我將< > 變成 [ ]