在这个例子中,您将帮助我们完成一个简单的日历应用程序。在你的代码中:
- 一个元素,允许用户在不同月份之间进行选择。
- onchange检测菜单中选择的值何时更改的事件处理程序。
- 一个函数叫做createCalendar()绘制日历并在<'h1>元素中显示正确的月份。
我们需要你在onchange处理函数中写一个条件语句,就在// ADD CONDITIONAL HERE任务的下面 。这应该:
- 查看所选月份(存储在choice变量中,这将是值更改后的元素值,例如“1月”)。
- 设置一个被调用days为等于所选月份天数的变量。
为此,您必须查看一年中每个月的天数。为了这个例子的目的,你可以忽略闰年。
提示:
建议您使用逻辑或将多个月组合成一个单一条件; 他们中的许多人共享相同的天数。
考虑最常用的天数,并将其用作默认值。
select.onchange = function() {
let choice = select.value;
let days = 31;
if(choice === ‘February’){
days = 28;
} else if (choice ===‘April’ || choice ===‘June’ || choice ===‘September’ || choice ===‘November’) {
days = 30;
}
createCalendar(days,choice);
}
function createCalendar(days,choice) {
list.innerHTML = ‘’;
h1.textContent = choice;
for (let i = 0; i <= days; i++) {
let listItem = document.createElement(‘li’);
listItem.textContent = i;
list.appendChild(listItem);
}
}
createCalendar(31,‘January’);