爲什麼我得到「無法讀取null的屬性樣式」錯誤？

uncaught typeError: Cannot read property 'style' of null" at line 38

當我在所有的div移動鼠標指針。每次我將指針移動到div時，都會出現錯誤。

請解釋是什麼問題。

var top = "p3"; 
 

 
function toTop(newTop) { 
 
    var domTop = document.getElementById(top).style; 
 
    var domNew = document.getElementById(newTop).style; 
 
    domTop.zIndex = "0"; 
 
    domNew.zIndex = "10"; 
 
    top = document.getElementById(newTop).id; 
 
}

.para1 { 
 
    position: absolute; 
 
    top: 10; 
 
    left: 120; 
 
    z-index: 0; 
 
    border: solid; 
 
    padding: 80; 
 
    width: 300; 
 
    background-color: aqua; 
 
} 
 
.para2 { 
 
    position: absolute; 
 
    top: 50; 
 
    left: 150; 
 
    z-index: 0; 
 
    border: solid; 
 
    padding: 80; 
 
    width: 300; 
 
    background-color: yellow; 
 
} 
 
.para3 { 
 
    position: absolute; 
 
    top: 100; 
 
    left: 180; 
 
    z-index: 0; 
 
    border: solid; 
 
    padding: 80; 
 
    width: 300; 
 
    background-color: red; 
 
}

<div style="z-index: 10;" class="para1" id="p1" onmouseover="toTop('p1')">Frame One</div> 
 
<div style="z-index: 5;" class="para2" id="p2" onmouseover="toTop('p2')">Frame Two</div> 
 
<div style="z-index: 0;" class="para3" id="p3" onmouseover="toTop('p3')">Frame Three</div>

來源

2016-11-14 Ankesh

@Fast蝸牛感謝您的編輯。我無法通過移動設備進行操作。 – Ankesh

將**保留**和只讀var'top'重命名爲'myTop' - 它會給出錯誤，因爲window.top是主窗口的句柄 – mplungjan

@mplungjan謝謝。有效。 – Ankesh

您需要的只讀 VAR top重命名爲例如myTop - 它給了錯誤，因爲window.top是主窗口

var myTop = "p3"; 

function toTop(newTop) { 
    var domTop = document.getElementById(myTop).style; 
    var domNew = document.getElementById(newTop).style; 
    domTop.zIndex = "0"; 
    domNew.zIndex = "10"; 
    myTop = document.getElementById(newTop).id; 
}

我找不到top是手柄保留在官方文檔中，但它屬於要避免的單詞列表，因爲它只是在瀏覽器實現中只讀。

來源

2016-11-14 06:34:01 mplungjan

top是在JavaScript保留標識，所以你不能把它作爲一個變量名。這意味着，在這個函數：

function toTop(newTop) { 
    // here `top` points to `window` 
    var domTop=document.getElementById(top).style; 
    var domNew=document.getElementById(newTop).style; 
    domTop.zIndex="0"; 
    domNew.zIndex="10"; 
    top=document.getElementById(newTop).id; 
}

top所指向的對象window，這就是爲什麼document.getElementById(top)回報null。

來源

2016-11-14 06:31:39

請僅僅因爲錯字而關閉？我已經評論過這個 – mplungjan

我不認爲這是一種類型。 OP不知道'top'是一個保留字。 –

@mplungjan我沒有將有意編寫的代碼分類爲拼寫錯誤。這個問題很有價值。 – 4castle

「top」是一個保留關鍵字，用於定義框架頂部，用下面的其他內容替換變量名稱「top」。

var top1 = "p3"; 

function toTop(newTop) { 
    var domTop = document.getElementById(top1).style; 
    var domNew = document.getElementById(newTop).style; 
    domTop.zIndex = "0"; 
    domNew.zIndex = "10"; 
    top1 = document.getElementById(newTop).id; 
}

來源

2016-11-14 06:33:56

你的代碼中有兩件事：** 1 /.**沒有什麼叫做'top2'，那麼，你應該把'top1'重命名爲另一個名字嗎？ ** 2 /.**你需要更新行'top = document.getElementById（newTop）.id;' –

謝謝。更正 –

爲什麼我得到「無法讀取null的屬性樣式」錯誤？

回答

相關問題