Uncaught (в обещании) TypeError: Не удается прочитать свойство 'style' из null - PullRequest
Новая
       0

Uncaught (в обещании) TypeError: Не удается прочитать свойство 'style' из null

0 голосов
/ 31 марта 2020

Я получаю ошибку, упомянутую в названии, и из того, что я увидел, кажется, довольно популярный вопрос.

РЕДАКТИРОВАТЬ: я знаю, что ошибка означает, что элемент, который я пытаюсь редактировать имеет значение null, но становится нулевым только после выполнения функции sleep.

Итак, здесь происходит то, что я хочу, чтобы информация отображалась на определенном div-динамике c, и я использую функцию сна, показанную ниже. Я получаю сообщение об ошибке на линии, которая идет сразу после нее. что может быть причиной здесь? По какой-то причине скрипт не распознает нужный мне элемент после вызова функции sleep (). если у вас есть лучший способ выполнить то, что я описал выше, тогда вы можете опубликовать ваши предложения. 

    document.getElementById("box_2_info_" + i).style.display = "contents";
            document.getElementById("box_2_info_" + i).className += " animate-bottom";
            await sleep(3000);
            //error below -->
            document.getElementById("box_2_info_" + i).style.display = "none";

Вот моя функция сна 

    function sleep(ms) {
            return new Promise(resolve => setTimeout(resolve, ms));
    };

Заранее спасибо,

Ответы [ 2 ]

1 голос
/ 31 марта 2020

Это потому, что вы не ожидаете готовности DOM, поэтому элемент DOM еще не доступен.

Если вы замените

document.addEventListener("DOMContentLoaded", run, false);

с

run()

Вы получите ту же ошибку 

(function () {
  "use strict";

  const run = async () => {
    var i = 0;
    var el = document.getElementById("box_2_info_" + i);

    el.style.display = "contents";
    el.classList.add("animate-bottom");
    console.log("sleeping...");
    await sleep(3000);
    console.log("awake!");
    el.style.display = "none";
  };

  const sleep = (ms) => {
    return new Promise((resolve) => setTimeout(resolve, ms));
  };

  document.addEventListener("DOMContentLoaded", run, false);
  // run();
})();
<!DOCTYPE html>

<html lang="en" ng-app="app">
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <div id="box_2_info_0"></div>
  </body>
</html>
0 голосов
/ 31 марта 2020

Вся эта ошибка означает, что свойство, которое вы пытаетесь редактировать, в этом случае элемент с идентификатором "box_2_info_" + i не существует. Я бы дважды проверил вашу разметку, чтобы убедиться, что это свойство существует.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...