JavaScript根據星期幾來更改元素類

我想根據一週中的某幾天調用不同的CSS類。JavaScript根據星期幾來更改元素類

<script type="text/javascript"> 
window.onload = function() { 
     var d = new Date(); 
     var weekday = new Array(7); 
     weekday[0] = "Sunday"; 
     weekday[1] = "Monday"; 
     weekday[2] = "Tuesday"; 
     weekday[3] = "Wednesday"; 
     weekday[4] = "Thursday"; 
     weekday[5] = "Friday"; 
     weekday[6] = "Saturday"; 
     var n = weekday[d.getDay()]; 
     if (n =='Tuesday') { 
      document.getElementById("td").className = "MyClass"; 
     } else { 
      document.getElementById("td").className = "red"; 
     } 
    } 
</script>

但是這段代碼不起作用。有人請幫忙。
這是我的全部代碼

<style> 

.red { 
    background-color: #ff0000; 
    } 
.blue { 
    background-color: #0000ff; 
     } 
.MyClass { 
     background-color: #b65d36; 
    } 
</style>` 
<script type="text/javascript"> 
document.write('<DIV color id="loading" align="center" style="border: 1px    solid #008080; position: fixed; top: 48%; left: 40%;"> 
<b>Product Service</b> <br /> 
<I>Loading, Please Wait....</I> 
<br><img src="../Images/progressbar.gif" alt="" style="border- style:  none; border-width: 0px" /></DIV>'); 
window.onload = function() { 
document.getElementById("loading").style.display = "none"; 
var d = new Date(); 
var weekday = new Array(7); 
weekday[0] = "Sunday"; 
     weekday[1] = "Monday"; 
     weekday[2] = "Tuesday"; 
     weekday[3] = "Wednesday"; 
     weekday[4] = "Thursday"; 
     weekday[5] = "Friday"; 
     weekday[6] = "Saturday"; 
     var n = weekday[d.getDay()]; 
     if (n =='Tuesday') { 
      document.getElementById("td").className = "MyClass"; 
     } else { 
      document.getElementById("td").className = "red"; 
     } 
    } 
</script> 
<link href="../Styles/style.css" rel="stylesheet" type="text/css" /> 
</head><body> 
<form id="form2" runat="server"> 
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"> 
</asp:ToolkitScriptManager>`  ` 
<asp:UpdateProgress ID="UpdateProgress1" runat="server" > 
<ProgressTemplate> 
<div class="modal"> 
<div class="center"> 
<img alt="" src="../Images/progressbar.gif" /> 
</div> 
</div> 
</ProgressTemplate> 
</asp:UpdateProgress> 
<div align="center" id="div_First" style="width: 100%;margin:auto;"> 
<table cellspacing="0" style="font-family:Lato;" cellpadding="0" width="98%" border="0"> 
<tr> 
<td align="left" colspan="2" class="Header" valign="middle"><b>Report</b> </td> 
</tr> 
<tr> 
<td colspan="2" style="padding-left:0px;"> 
<table width="100%" style="border: 1px solid #669999;background-color:#FFFF95; color:black;"> 
<tr> 
<td width="33%" align="left" valign="top" > 
<table width="100%" > 
<tr> <td >Product </td>   
<td align="left"> 
<asp:DropDownList ID="ddl_Product" TabIndex="1" CssClass="txtboxAll" Width="210px" runat="server"> 
</asp:DropDownList>          
<asp:CascadingDropDown ID="CascadingDropDown5" runat="server" 
Category="Product" TargetControlID="ddl_Product" 
PromptText="[Select Product]" LoadingText="Loading Product..." 
ServicePath="~/Services/Productservice.asmx" 
ServiceMethod="GetDropDownProduct" Enabled="True"> 
</asp:CascadingDropDown>  
</td> 
</tr> 
<tr> 
<td >Name</td> 
<td> 
<asp:DropDownList ID="ddl_name" CssClass="txtboxAll" AutoPostBack="true" Width="210px" runat="server" ></asp:DropDownList> 
<asp:CascadingDropDown ID="cdd_facility" runat="server" Category="name" TargetControlID="ddl_name" PromptText="[Select Name]" LoadingText="Loading Name..."  ServicePath="~/Services/Productservice.asmx" ServiceMethod="GetDropDownname"> 
</asp:CascadingDropDown> 
    </td>  
    </tr> 
    </tr> 
    <tr> 
    <td align="right" colspan="3"> 
    <asp:Button ID="but_submit" runat="server" CssClass="btn5" Text="Search"/> </td> 
</tr> 
</table> 
</form> 
</body>

這是我的全部代碼。它不工作。 CSS類MyClass不起作用。

來源

2017-02-28 Serah Math

什麼是不工作？ – Sefe

如果有什麼錯誤？ –

你的代碼是正確的.....請向我們展示更多的代碼....如果可能的話爲同一個 – Kenny

當我打開控制檯上你的代碼，我看到以下內容：

「遺漏的類型錯誤：不能爲空的設置屬性‘的className’」

此行似乎是這個問題：

 document.getElementById("td").className = "MyClass";

您的頁面中沒有任何id爲「td」的存在（因此存在錯誤）。我相信你想是這樣的：

if (n =='Tuesday') { 
     var arr = document.getElementsByTagName("td"); 
     for(var i=0; i<arr.length; i++) 
      arr[i].className = "MyClass"; 
    } else { 
     var arr = document.getElementsByTagName("td"); 
     for(var i=0; i<arr.length; i++) 
      arr[i].className = "red"; 
    }

否則，創建一個標籤爲「TD」的ID

來源

2017-12-18 12:47:55

JavaScript根據星期幾來更改元素類

回答

相關問題