網頁製作相容Mozilla必須知道的知識

網頁

IE	Mozilla	說明
document.all(id)	document.getElementById(id)	無
document.all	document.getElementsByTagName("*")	無
document.body.clientHeight(clientWidth)根據HTML的DTD而定方能得到準確值。	window.innerHeight(innerWidth)根據HTML的DTD而定方能得到準確值。	無
opacity(aplha=20)	MozOpacity="0.2"	可參看我的blog這篇文章
event.clientY(clientX)	event.pageY(pageX)	無
event.keyCode	event.which	無
event.srcElement	event.target	無
window.external.AddFavorite('never-online.net', "never-online'website");	window.sidebar.addPanel('never-online.net', "never-online'website", "");	無
event.clientY(clientX)	event.pageY(pageX)	無
(DHTML事件-滾輪事件)onmousewheel	DOMMouseScroll	可參看我的blog這篇文章
window.showModalDialog	window.open(url, "name", "modal=yes")	無
createPopup()	xul	無
htc控制項	xbl綁定	無
filter濾鏡	只支援alpha（透明度，部分可通過clip來類比）	無
obj.setCapture()	window.captureEvents(Event.eventType)	無
obj.attachEvent(type, listener)	obj.addEventListener(type, listener, useCapture)	無
obj.detachEvent(type, listener)	obj.removeEventListener(type, listener, useCapture)	無
指令碼預解釋執行 o={ foo: function(){ alert("never-online"); } }; with (o) { bar(); function bar(){ alert("never-online"); } foo(); } 上面的代碼成功輸出never-online	指令碼順序執行。o={ foo: function(){ alert("never-online"); } }; with (o) { bar(); function bar(){ alert("never-online"); } foo(); } 報錯bar未定義	解決方案有很多種，請參見我這裡的評論或者這篇文章
支援Webdings字型	不支援Webdings字型	無
insertAdjacentHTML, insertAdjacentElement方法	本身不支援，但可通過insertBefore或通過Range實現	可參見我這篇文章的代碼
不支援	讀寫器__defineSetter(Getter)__	無
不支援	支援對Element，EVENT等對象的prototype模式支援	無
不支援	對節點有nodeType常量屬性	無
new ActiveXObject("MSXML2.XMLHTTP")或更高版本的ProgId	XMLHttpRequest對象	無
設定類似style.top=20這樣的高度時，可不使用單位	設定類似style.top=20+'px'這樣的高度時，必須使用單位，否則無效	無
CSS的類名，不區分大小寫（大小寫不敏感）	CSS的類名，區分大小寫（大小寫敏感）如：.myCss和.mycss類名就是不相同的	無
冒泡事件event.cancelBubble=true	event.stopPropagation()（需要傳遞event事件）	無
parentElement	預設不支援，但可以利用Mozilla特性類比 HTMLElement.prototype.__defineGetter__("parentElement", function () {if (this.parentNode == this.ownerDocument) return null;return this.parentNode;});	無
無空白節點	因為Mozilla下NodeType下定義有12種節點屬性，所以要去除空白的節點方能得到預期值 var notspace = /\S/; function cleanWhitespace(node) { for (var x=0; x<node.childNodes.length; x++) { var child = node.childNodes[x]; if ((child.nodeType == 3) && (!notspace.test(child.nodeValue))) { node.removeChild(node.childNodes[x]); x--; }; if(child.nodeType == 1) { cleanWhitespace(child); } } }	無
CSS padding寬度並不在offset位移座標之內	CSS padding寬度預設是在offset位移座標之內，可用-moz-box-sizing:border-box來設定即可基本與IE相同	可參見我這篇文章的代碼
js動態載入xslt檔案將xml轉化成HTML，IE可用xmldoc.transformNode(xslDocument)方法	Mozilla中相對麻煩一些，要經過幾道工序XSLTProcessor對象,transformToFragment或其它方法