Не заполняется <li> с классом при помощи javascript

192
14 февраля 2019, 05:40

Хочу чтобы программа определяла день недели и заполняла расписание в связи с этим, но она заполняет только div, а li не заполняет, что не так?

    <html>
  <head>
    <meta charset="utf-8">
    <title>&#10084;</title>
    <link href="style.css" rel="stylesheet">
  </head>
  <body>
    <div id="TODAY">
    </div>
    <ul class="items">
      <li class="todayfirst"></li>
      <li class="todaysecond"></li>
      <li class="todaythird"></li>
      <li class="todayother"></li>
    </ul>
    <div id="TOMORROW">
    </div>
    <ul class="items">
      <li class="tomorrowfirst"></li>
      <li class="tomorrowsecond"></li>
      <li class="tomorrowthird"></li>
      <li class="tomorrowother"></li>
    </ul>
    <script>
            var mn = "Понедельник";
            var tu = "Вторник";
            var wd = "Среда";
            var th = "Четверг";
            var fr = "Пятница";
            var st = "Суббота";
            var sd = "Воскресенье";
            var mn1 = "Линейная алгебра в 9:30-10:50 230 аудитория";
            var mn2 = "Программирование 11:10-12:30 402 аудитория";
            var tu1 = "Дискретная математика в 9:30-10:50 224 аудитория";
            var tu2 = "Программирование 11:10-12:30 146 аудитория";
            var tu3 = "Дискретная математика в 12:40-14:00 206 аудитория";
            var wd1 = "Алгебра в 11:10-12:30 319 аудитория";
            var th1 = "Английский язык в 11:10-12:30 203 аудитория";
            var th2 = "Английский язык в 12:40-14:00 203 аудитория";
            var fr1 = "Психология(лекция) в 11:10-12:30 225 аудитория";
            var fr2 = "Психология(практика) в 12:40-14:00 206 аудитория";
            var st1 = "Мат.Анализ(лекция) в 9:30-10:50 302 аудитория";
            var st2 = "Мат.Анализ(практика) в 11:10-12:30 302 аудитория";
            var sd1 = "Можно почилить &#10084";
            var DAYNUMBER = new Date().getDay();
            var today = document.getElementById('TODAY');
            var tomorrow = document.getElementById('TOMORROW');
            var todayfirst = document.getElementsByClassName('todayfirst');
            var todaysecond = document.getElementsByClassName('todaysecond');
            var todaythird = document.getElementsByClassName('todaythird');
            var todayother = document.getElementsByClassName('todayother');
            var tomorrowfirst = document.getElementsByClassName('tomorrowfirst');
            var tomorrowsecond = document.getElementsByClassName('tomorrowsecond');
            var tomorrowthird = document.getElementsByClassName('tomorrowthird');
            var tomorrowother = document.getElementsByClassName('tomorrowother');
            switch(DAYNUMBER){
              case 1: today.innerHTML=mn;
                      todayfirst.innerHTML=mn1;
                      todaysecond.innerHTML=mn2;
                      tomorrow.innerHTML=tu;
                      tomorrowfirst.innerHTML=tu1;
                      tomorrowsecond.innerHTML=tu2;
                      tomorrowthird.innerHTML=tu3;
              break;
              case 2: today.innerHTML=tu;
                      todayfirst.innerHTML=tu1;
                      todaysecond.innerHTML=tu2;
                      todaythird.innerHTML=tu3;
                      tomorrow.innerHTML=wd;
                      tomorrowfirst.innerHTML=wd1;
              break;
              case 3: today.innerHTML=wd;
                      todayfirst.innerHTML=wd1;
                      tomorrow.innerHTML=th;
                      tomorrowfirst.innerHTML=th1;
                      tomorrowsecond.innerHTML=th2;
              break;
              case 4: today.innerHTML=th;
                      todayfirst.innerHTML=th1;
                      todaysecond.innerHTML=th2;
                      tomorrow.innerHTML=fr;
                      tomorrowfirst.innerHTML=fr1;
                      tomorrowsecond.innerHTML=fr2;
                      tomorrowother.innerHTML="На лекции будет тест!!!";
              break;
              case 5: today.innerHTML=fr;
                      todayfirst.innerHTML=fr1;
                      todayfirst.innerHTML=fr2;
                      todayother.innerHTML="На лекции будет тест!!!";
                      tomorrow.innerHTML=st;
                      tomorrowfirst.innerHTML=st1;
                      tomorrowsecond.innerHTML=st2;
              break;
              case 6: today.innerHTML=st;
                      todayfirst.innerHTML=st1;
                      todaysecond.innerHTML=st2;
                      tomorrow.innerHTML=sd;
                      tomorrowfirst.innerHTML=sd1;
              break;
              case 7: today.innerHTML=sd;
                      todayfirst.innerHTML=sd1;
                      tomorrow.innerHTML=md;
                      tomorrowfirst.innerHTML=mn1;
                      tomorrowsecond.innerHTML=mn2;
              break;
            }
    </script>
  </body>
</html>
Answer 1

Чтоб вывести новое значение, надо получить сам элемент, а вы получаете массивоподобный объект. Вот так будет работать: 

var todayfirst = document.getElementsByClassName('todayfirst')[0];
todayfirst.innerHTML = "test"
READ ALSO
Преобразование типов для примитивов [дубликат]
javascript

Преобразование типов для примитивов [дубликат]

На данный вопрос уже ответили:

 144
JavaScript, P5.JS, Canvas - Размер канвы и странности метода rect()
javascript

JavaScript, P5.JS, Canvas - Размер канвы и странности метода rect()

Использую библиотеку P5JS чтобы нарисовать квадрат шириной и высотой во всю канву:

 166
Получить число после зяпятой
javascript

Получить число после зяпятой

Есть число 25652, как получить оставшееся число после точки?

 162
Как на js проверить человек зашел или робот?
javascript

Как на js проверить человек зашел или робот?

Как на js можно определить кто зашел на сайт? робот или человек? Потому что для человека нужно показать секретные блоки, которые роботу нельзя...

 172