網頁的DOCTYPE HTML public 會導致頁面的部分事件不觸發

網頁|頁面

最近忙著做JS，在JS裡頭有用到滑鼠的一些事件時，通常我都是把滑鼠事件包含在一個JS檔案中調用
<script type="text/javascript" src="js/sb_cd.js"></script>

在滑鼠事件中若包含如下滑鼠的特效，就會導致事件觸發：js/sb_cd.js
// JavaScript Document 

var sb_cd_a_Colour='fff000';
var sb_cd_b_Colour='00ff00';
var sb_cd_c_Colour='ff00ff';
var sb_cd_Size=120;

var sb_cd_YDummy=new Array(),sb_cd_XDummy=new Array(),sb_cd_xpos=0,sb_cd_ypos=0,sb_cd_ThisStep=0;sb_cd_step=0.6;
if (document.layers){
window.captureEvents(Event.MOUSEMOVE);
function sb_cd_nsMouse(evnt){
sb_cd_xpos = window.pageYOffset+evnt.pageX+6;
sb_cd_ypos = window.pageYOffset+evnt.pageY+16;
}
window.onMouseMove = sb_cd_nsMouse;
}
else if (document.all)
{
function sb_cd_ieMouse(){
sb_cd_xpos = document.body.scrollLeft+event.x+6;
sb_cd_ypos = document.body.scrollTop+event.y+16;
}
document.onmousemove = sb_cd_ieMouse;
}

function sb_cd_swirl(){
for (i = 0; i < 3; i++)
 {
 sb_cd_YDummy[i]=sb_cd_ypos+sb_cd_Size*Math.sin((1*Math.sin((sb_cd_ThisStep)/10))+i*2)*Math.sin((sb_cd_ThisStep)/4);
 sb_cd_XDummy[i]=sb_cd_xpos+sb_cd_Size*Math.cos((1*Math.sin((sb_cd_ThisStep)/10))+i*2)*Math.sin((sb_cd_ThisStep)/4);
 }
sb_cd_ThisStep+=sb_cd_step;
setTimeout('sb_cd_swirl()',10);
}

var sb_cd_amount=10;
if (document.layers){
for (i = 0; i < sb_cd_amount; i++)
{
document.write('<layer name=sb_cd_nsa'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+sb_cd_a_Colour+'></layer>');
document.write('<layer name=sb_cd_nsb'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+sb_cd_b_Colour+'></layer>');
document.write('<layer name=sb_cd_nsc'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+sb_cd_c_Colour+'></layer>');
}
}
else if (document.all){
document.write('<div id="sb_cd_ODiv" style="position:absolute;top:0px;left:0px">'
+'<div id="sb_cd_IDiv" style="position:relative">');
for (i = 0; i < sb_cd_amount; i++)
{
document.write('<div id=sb_cd_x style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+sb_cd_a_Colour+';font-size:'+i/2+'"></div>');
document.write('<div id=sb_cd_y style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+sb_cd_b_Colour+';font-size:'+i/2+'"></div>');
document.write('<div id=sb_cd_z style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+sb_cd_c_Colour+';font-size:'+i/2+'"></div>');
}
document.write('</div></div>');
}
function sb_cd_prepos(){
var sb_cd_ntscp=document.layers;
var sb_cd_msie=document.all;
if (document.layers){
for (i = 0; i < sb_cd_amount; i++)
{
 if (i < sb_cd_amount-1)
 {
 sb_cd_ntscp['sb_cd_nsa'+i].top=sb_cd_ntscp['sb_cd_nsa'+(i+1)].top;sb_cd_ntscp['sb_cd_nsa'+i].left=sb_cd_ntscp['sb_cd_nsa'+(i+1)].left;
 sb_cd_ntscp['sb_cd_nsb'+i].top=sb_cd_ntscp['sb_cd_nsb'+(i+1)].top;sb_cd_ntscp['sb_cd_nsb'+i].left=sb_cd_ntscp['sb_cd_nsb'+(i+1)].left;
 sb_cd_ntscp['sb_cd_nsc'+i].top=sb_cd_ntscp['sb_cd_nsc'+(i+1)].top;sb_cd_ntscp['sb_cd_nsc'+i].left=sb_cd_ntscp['sb_cd_nsc'+(i+1)].left;
 }
else 
 {
 sb_cd_ntscp['sb_cd_nsa'+i].top=sb_cd_YDummy[0];sb_cd_ntscp['sb_cd_nsa'+i].left=sb_cd_XDummy[0];
 sb_cd_ntscp['sb_cd_nsb'+i].top=sb_cd_YDummy[1];sb_cd_ntscp['sb_cd_nsb'+i].left=sb_cd_XDummy[1];
 sb_cd_ntscp['sb_cd_nsc'+i].top=sb_cd_YDummy[2];sb_cd_ntscp['sb_cd_nsc'+i].left=sb_cd_XDummy[2];
 }
}
}
else if (document.all){
for (i = 0; i <  sb_cd_amount; i++)
{
 if (i < sb_cd_amount-1)
 {
 sb_cd_msie.sb_cd_x[i].style.top=sb_cd_msie.sb_cd_x[i+1].style.top;sb_cd_msie.sb_cd_x[i].style.left=sb_cd_msie.sb_cd_x[i+1].style.left;
 sb_cd_msie.sb_cd_y[i].style.top=sb_cd_msie.sb_cd_y[i+1].style.top;sb_cd_msie.sb_cd_y[i].style.left=sb_cd_msie.sb_cd_y[i+1].style.left;
 sb_cd_msie.sb_cd_z[i].style.top=sb_cd_msie.sb_cd_z[i+1].style.top;sb_cd_msie.sb_cd_z[i].style.left=sb_cd_msie.sb_cd_z[i+1].style.left;
 }
else
 {
 sb_cd_msie.sb_cd_x[i].style.top=sb_cd_YDummy[0];sb_cd_msie.sb_cd_x[i].style.left=sb_cd_XDummy[0];
 sb_cd_msie.sb_cd_y[i].style.top=sb_cd_YDummy[1];sb_cd_msie.sb_cd_y[i].style.left=sb_cd_XDummy[1];
 sb_cd_msie.sb_cd_z[i].style.top=sb_cd_YDummy[2];sb_cd_msie.sb_cd_z[i].style.left=sb_cd_XDummy[2];
 }
}
}
setTimeout("sb_cd_prepos()",10);
}
function sb_cd_Start(){
sb_cd_swirl(),sb_cd_prepos()
}
window.onload=sb_cd_Start;

其中頁面的代碼如下：
當開啟DW時，通常會先有這樣預先定義好的代碼，先看看第一行
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>無標題文檔</title>
</head>

<body>
<script type="text/javascript" src="js/sb_cd.js"></script>
</body>
</html>

問題找了很久，都不知道是什麼地方的問題。後來才發現是DW產生的程式碼第一句
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
使得這個滑鼠事件不運行。，原來這裡聲明了後面的滑鼠事件必須遵循這個DTD文檔 的規則。
而不事件中的一些定義沒有遵循，所以這個滑鼠事件即不觸發，也不報錯。

官方是這樣定義 DOCTYPE HTML PUBLIC 的

!DOCTYPE

指定了 HTML 文檔遵循的文件類型定義(DTD)。

Microsoft^® Internet Explorer 6 的新增內容

你可使用此聲明將 Internet Explorer 6 及以後版本切換到標準相容模式下。

文法

HTML	頂級元素  可用性 "註冊//組織//類型 標籤//定義  語言""URL"

可能值

頂級元素	指定 DTD 中聲明的頂級元素類型。這與聲明的 SGML 文件類型相對應。 HTML 預設。HTML。
可用性	指定正式公開標識符(FPI)是可公開訪問的對象還是系統資源。 PUBLIC 預設。可公開訪問的對象。 SYSTEM 系統資源，如本地檔案或 URL。
註冊	指定組織是否由國際標準組織(ISO)註冊。 + 預設。組織名稱登入。 - 組織名稱未註冊。網際網路工程任務推動小組(IETF)和全球資訊網協會(W3C)並非註冊的 ISO 組織。
組織	指定表明負責由 !DOCTYPE 聲明引用的 DTD 的建立和維護的團體或組織的名稱，即 OwnderID。 IETF IETF。 W3C W3C。
類型	指定公開文本類，即所引用的物件類型。 DTD 預設。DTD。
標籤	指定公開文本描述，即對所引用的公開文本的唯一描述性名稱。後面可附帶版本號碼。 HTML 預設。HTML。
定義	指定文件類型定義。 Frameset 框架組文檔。 Strict 排除所有 W3C 專家希望逐步淘汰的代表性屬性和元素，因為樣式表已經很完善了。 Transitional 包含除 frameSet 元素的全部內容。
語言	指定公開文本語言，即用於建立所引用對象的自然語言編碼系統。該語言定義已編寫為 ISO 639 語言代碼(大寫兩個字母)。 EN 預設。英語。
URL	指定所引用對象的位置。

注釋

此聲明必須出現在文檔的起始處，出現在 html 標籤之前。

!DOCTYPE 元素不需要關閉標籤。

此元素在 Microsoft^® Internet Explorer 3.0 的 HTML 中可用。

你可使用此聲明在 Internet Explorer 6 及以後版本中切換為嚴格的標準相容模式。若想開啟此開關，請在你的文檔頂部包含 !DOCTYPE 聲明，在聲明中指定合法的標籤，在某些情況下，還需要指定定義和/或 URL。下面的表格列出了標準相容模式的開關情況。

DOCTYPE	出現 URL	未出現 URL
未出現 DOCTYPE	關	關
HTML (無版本)	關	關
HTML 2.0	關	關
HTML 3.0	關	關
HTML 4.0	開	開
HTML 4.0 Frameset	開	關
HTML 4.0 Transitional	開	關
HTML 4.0 Strict	開	開
XHTML	開	開
XML	開	開
無法識別的 DOCTYPE	開	開

注意 在標準相容模式下，不能保證與其它版本的 Internet Explorer 保持相容。當開啟標準相容模式時，文檔的渲染行為也許與將來版本的 Internet Explorer 不同。若內容本來就是固定的(如燒錄在 CD 上)，則不應該使用此模式。

樣本

下面的例子示範了如何使用 !DOCTYPE 聲明指定文檔遵從的 DTD，並將 Internet Explorer 6 及更高版本切換到標準相容模式。

下面例子中的聲明都指定了遵從 HTML 4.0 DTD。第二種聲明指定了“Strict”。第一種聲明沒有指定。這兩種聲明都將會把 Internet Explorer 6 及以後版本切換到標準相容模式。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">

下面例子中的聲明都指定了遵從“Transitional”HTML 4.0 DTD。第二種聲明指定了 DTD 的 URL。第一種聲明沒有指定。第二種聲明將會把 Internet Explorer 6 及以後版本切換到標準相容模式。第一種聲明不會。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"     "http://www.w3.org/TR/html4/loose.dtd">

標準資訊