JavaScript TypeError: Невозможно прочитать свойство 'style' из null

У меня есть JavaScript-код, а ниже строка имеет проблемы.

Ответы

Ответ 1

В вашем сценарии эта часть:

document.getElementById('Noite')

должен возвращать null и вы также пытаетесь установить для свойства display недопустимое значение. Есть несколько возможных причин, по которым эта первая часть будет null.

Вы запускаете сценарий слишком рано, прежде чем документ будет загружен, и поэтому элемент Noite не может быть найден.
В вашем HTML нет элемента Noite.

Я должен отметить, что использование вами document.write() в этом случае кода, вероятно, означает проблему. Если документ уже загружен, то новый document.write() очистит старое содержимое и запустит новый свежий документ, поэтому элемент Noite не будет найден.

Если ваш документ еще не был загружен и, таким образом, вы выполняете встроенную функцию document.write() чтобы добавить встроенный HTML-код в текущий документ, то ваш документ еще не был полностью загружен, поэтому, возможно, по этой причине он не может найти элемент Noite,

Решение, вероятно, состоит в том, чтобы поместить эту часть вашего сценария в самый конец документа, чтобы все до того, как он уже был загружен. Итак, перенесите это в конец своего тела:

document.getElementById('Noite').style.display='block';

И убедитесь, что в javascript нет операторов document.write() после загрузки документа (потому что они очистят предыдущий документ и начнут новый).

Кроме того, установка свойства display на "display" не имеет смысла для меня. Допустимые параметры для этого: "block", "inline", "none", "table" и т.д. Я не знаю ни одного параметра с именем "display" для этого свойства стиля. Смотрите здесь действительные опции для свойства display.

Вы можете увидеть исправленный код здесь в этой демонстрации: http://jsfiddle.net/jfriend00/yVJY4/. Этот jsFiddle настроен на размещение javascript в конце тела документа, поэтому он запускается после загрузки документа.

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

Мне действительно трудно понять, что вы спрашиваете, но здесь приведена исправленная версия вашего кода, которая работает, вы также можете увидеть здесь: http://jsfiddle.net/jfriend00/QCxwr/. Вот список изменений, которые я сделал:

Сценарий находится в теле, но после содержимого, на которое он ссылается.
Я добавил var объявления к вашим переменным (хорошая привычка всегда использовать).
Оператор if был изменен на if/else, который намного эффективнее и самодокументирован относительно того, что вы делаете.
Я добавил фигурные скобки для каждого оператора if чтобы было абсолютно ясно, какие операторы являются частью if/else а какие нет.
Я правильно закрыл </dd> вы вставляли.
Я изменил style.display = ''; to style.display = 'block'; ,
Я добавил точки с запятой в конце каждого утверждения (еще одна хорошая привычка).

Код:

<div id="Night" style="display: none;">
    <img src="Img/night.png" style="position: fixed; top: 0px; left: 5%; height: auto; width: 100%; z-index: -2147483640;">
    <img src="Img/moon.gif" style="position: fixed; top: 0px; left: 5%; height: 100%; width: auto; z-index: -2147483639;">
</div>    
<script>
document.write("<dl><dd>");
var day = new Date();
var hr = day.getHours();
if (hr == 0) {
    document.write("Meia-noite!<br>Já é amanhã!");
} else if (hr <=5 ) {
    document.write("&nbsp;&nbsp;Você não<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;devia<br>&nbsp;&nbsp;&nbsp;&nbsp;estar<br>dormindo?");
} else if (hr <= 11) {         
    document.write("Bom dia!");
} else if (hr == 12) {
    document.write("&nbsp;&nbsp;&nbsp;&nbsp;Vamos<br>&nbsp;almoçar?");
} else if (hr <= 17) {
    document.write("Boa Tarde");
} else if (hr <= 19) {
    document.write("&nbsp;Bom final<br>&nbsp;de tarde!");
} else if (hr == 20) {
    document.write("&nbsp;Boa Noite"); 
    document.getElementById('Noite').style.display='block';
} else if (hr == 21) {
    document.write("&nbsp;Boa Noite"); 
    document.getElementById('Noite').style.display='none';
} else if (hr == 22) {
    document.write("&nbsp;Boa Noite");
} else if (hr == 23) {
    document.write("Ó Meu! Já é quase meia-noite!");
}
document.write("</dl></dd>");
</script>

Ответ 2

Это происходит потому, что document.write будет перезаписывать ваш существующий код, поэтому разместите div перед кодом javascript. например:.

CSS

#mydiv { 
  visibility:hidden;
 }

Внутри вашего html файла

<div id="mydiv">
   <p>Hello world</p>
</div>
<script type="text/javascript">
   document.getElementById('mydiv').style.visibility='visible';
</script>

Надеюсь, это было полезно

Ответ 3

Вы пропали после ночи. прямо здесь getElementById ('Ночь

Ответ 4

Я столкнулся с одной и той же проблемой, мне нужно скачать флеш-игру, вставив тег и игру H5 по iframe, мне нужна загрузочная коробка там, когда загрузка флеш-памяти или H5 была сделана, пусть в поле загрузки нет ни одного. хорошо, вспышка работает хорошо, но когда что-то идет в iframe, я не могу найти свойство 'style' от null, поэтому добавляю к нему часы, и он работает

let clock = setInterval(() => {
        clearInterval(clock)
        clock = null
        document.getElementById('loading-box').style.display = 'none'
    }, 200)

Ответ 5

Для меня мой тег Script был вне элемента body. Скопировал его перед закрытием тега body. Это сработало

enter code here

<h1 id = 'title'>Black Jack</h1>
<h4> by Meg</h4>

<p id="text-area">Welcome to blackJack!</p>
<button id="new-button">New Game</button>
<button id="hitbtn">Hit!</button>
<button id="staybtn">Stay</button>

 <script src="script.js"></script>

Ответ 6

просто я думаю, что вам не хватает ни одной кавычки в вашем коде

if ((hr==20)) document.write("Good Night"); document.getElementById('Night"here").style.display=''

так должно быть

if ((hr==20)) document.write("Good Night"); document.getElementById('Night').style.display=''