Javascript函數取消隱藏元素似乎沒有調出var

試圖在我的網站的標題上顯示一條消息，其中應該更改日期的每日基數。使用下面的腳本，但似乎沒有調用var。因爲它什麼都沒有顯示，我不知道哪一個錯過了這個。Javascript函數取消隱藏元素似乎沒有調出var

<script type="function/javascritp"> 
function unhide(id) { 
    var element = document.getElementById(id); 
    element.className = element.className.replace('hidden', ''); 
} 

switch((new Date()).getDay()) { 
    case 0: 
     // Sunday 
     unhide('sun'); 
     break; 
    case 1: 
     // Monday 
     unhide('mon'); 
     break; 
    case 2: 
     // Tuesday 
     unhide('tues'); 
     break; 
    case 3: 
     // Wednesday 
     unhide('wed'); 
     break; 
    case 4: 
     // Thursday 
     unhide('thurs'); 
     break; 
    case 5: 
     // Friday 
     unhide('fri'); 
     break; 
    case 6: 
     // Saturday 
     unhide('sat'); 
     break; 
}; 
</script> 
</head> 

<body> 

<Header> 
<div id="sun" class="hidden">Today is Sunday</div> 
<div id="mon" class="hidden">Today is Monday</div> 
<div id="tues" class="hidden">Today is Tuesday</div> 
<div id="wed" class="hidden">Today is Wednesday</div> 
<div id="thurs" class="hidden">Today is Thursday</div> 
<div id="fri" class="hidden">Today is Friday</div> 
<div id="sat" class="hidden">Today is Saturday</div> 
</header> 
</body>

im使用CSS代碼，

.hidden { 
    display: none; 
}

來源

2015-07-19 Rdcelestial

你的html在哪裏？ –

它必須是'.hidden'而不是隱藏 – Tushar

是那樣的流浪。假設是類名的一部分？ –

它必須是在.hidden CSS不hidden;你忘了添加一段.，其餘全部看起來不錯

function unhide(id) { 
 
    var element = document.getElementById(id); 
 
    element.className = element.className.replace('hidden', ''); 
 
} 
 

 
switch((new Date()).getDay()) { 
 
    case 0: 
 
     // Sunday 
 
     unhide('sun'); 
 
     break; 
 
    case 1: 
 
     // Monday 
 
     unhide('mon'); 
 
     break; 
 
    case 2: 
 
     // Tuesday 
 
     unhide('tues'); 
 
     break; 
 
    case 3: 
 
     // Wednesday 
 
     unhide('wed'); 
 
     break; 
 
    case 4: 
 
     // Thursday 
 
     unhide('thurs'); 
 
     break; 
 
    case 5: 
 
     // Friday 
 
     unhide('fri'); 
 
     break; 
 
    case 6: 
 
     // Saturday 
 
     unhide('sat'); 
 
     break; 
 
};

.hidden{display:none}

<Header> 
 
<div id="sun" class="hidden">Today is Sunday</div> 
 
<div id="mon" class="hidden">Today is Monday</div> 
 
<div id="tues" class="hidden">Today is Tuesday</div> 
 
<div id="wed" class="hidden">Today is Wednesday</div> 
 
<div id="thurs" class="hidden">Today is Thursday</div> 
 
<div id="fri" class="hidden">Today is Friday</div> 
 
<div id="sat" class="hidden">Today is Saturday</div> 
 
</Header>

來源

2015-07-19 12:20:37 Tushar

對於初學者語法事：腳本聲明type="function/javascritp"應該type="text/javascript"。不確定不同的瀏覽器如何處理未知的腳本類型，但是根本沒有執行代碼。

然後當使用getElementById時出現'問題'。如果在DOM被加載之前使用它，那麼所討論的元素可能不存在，並且getElementById將返回null。在該示例中，腳本似乎位於head部分，在那裏肯定會出現問題。爲了防止這種情況，您可以在window.onload事件中調用取消隱藏功能。（更完整的信息here）

冒昧中更改交換機的情況下，以在本例中爲更好地瞭解一個數組，但原則保持不變：

<script type="text/javascript">  
function unhide(id) { 
    var element = document.getElementById(id); 
    element.className = element.className.replace('hidden', ''); 
} 

window.onload = function(){ 
    var day = (new Date()).getDay();  
    var days = ['sun','mon', 'tues', 'wed', 'thurs','fri', 'sat']; 
    unhide(days[day]); 
}; 
</script>

注意，雖然取消隱藏功能在卸載之前被聲明，直到在onload事件中使用它才被調用。所以當時也調用getElementById。

來源

2015-07-19 12:49:46

已經改變了type =「text/javascript」但它有相同的結果，還是空白的結果。 – Rdcelestial

並且您是否將開關（或使用上面的代碼）移動到window.unload？（或者將整個腳本移動到body標籤的末尾，而不是頭標籤的內部） –

我只是使用上面的代碼，我將它移動到了最後。 – Rdcelestial

這是最容易實施的情況。

function unhide(id) { 
    var element = document.getElementById(id); 
    element.className = element.classList.remove('hidden'); 
}

來源

2015-07-19 13:04:28

Javascript函數取消隱藏元素似乎沒有調出var

回答

相關問題