Таблица с датой на JavaScript

132
22 ноября 2019, 06:30

Как сделать так, чтобы таблица не рисовалась каждую секунду, а изменлись значения в ней?

window.addEventListener("DOMContentLoaded", () => {
function getInfo() {
    let date = new Date(),
        year = +date.getFullYear(),
        month = +(date.getMonth() + 1),
        day = +date.getDate(),
        hour = +date.getHours(),
        minutes = +date.getMinutes(),
        second = +date.getSeconds();

    let table = document.createElement("table");
    table.innerHTML += '<tr><td>Год</td><td>' + year + '</td></tr>';
    table.innerHTML += '<tr><td>Месяц</td><td>' + month + '</td></tr>';
    table.innerHTML += '<tr><td>День</td><td>' + day + '</td></tr>';
    table.innerHTML += '<tr><td>Час</td><td>' + hour + '</td></tr>';
    table.innerHTML += '<tr><td>Минута</td><td>' + minutes + '</td></tr>';
    table.innerHTML += '<tr><td>Секунда</td><td>' + second + '</td></tr>';

    document.body.appendChild(table);
};

setInterval(getInfo, 1000);
Answer 1

function getInfo() { 
  let table = document.getElementById('timetable'); 
  if (!table) { 
    table = document.createElement("table"); 
    table.innerHTML = `<tr><td>Год</td><td id="table-year"></td></tr> 
      <tr><td>Месяц</td><td id="table-month"></td></tr> 
      <tr><td>День</td><td id="table-day"></td></tr> 
      <tr><td>Час</td><td id="table-hour"></td></tr> 
      <tr><td>Минута</td><td id="table-minutes"></td></tr> 
      <tr><td>Секунда</td><td id="table-seconds"></td></tr>`; 
    table.id = 'timetable'; 
    document.body.appendChild(table); 
  } 
  let date = new Date(), 
    year = +date.getFullYear(), 
    month = +(date.getMonth() + 1), 
    day = +date.getDate(), 
    hour = +date.getHours(), 
    minutes = +date.getMinutes(), 
    seconds = +date.getSeconds(); 
  let dateObj = { 
    year, 
    month, 
    day, 
    hour, 
    minutes, 
    seconds 
  }; 
  for (let key in dateObj) { 
    document.getElementById('table-' + key).textContent = dateObj[key]; 
  } 
 
}; 
 
 
setInterval(getInfo, 1000);

READ ALSO
Перенести данные из одной таблицы в другую

Перенести данные из одной таблицы в другую

Есть две таблицы, в обеих id_product - соответствует номеру товара

142
Появились лишние слайды

Появились лишние слайды

Использую слайдер lightSlider и одновременно magnific-popup(что бы картинка открывалась в модальном окне)И произошла такая проблема, добавил всего два...

137
NodeJS Вернуть данные из БД по клику

NodeJS Вернуть данные из БД по клику

Скрывать не буду, NodeJS для меня темный лесЕсть тестовая база с телефонами в MYSQL

162