У меня есть контейнер div id="cMsgArea"
, который используется для размещения нескольких div, которые динамически добавляются через AJAX. Мне нужно контролировать количество дочерних div, которые видны в любой момент времени.Проверка стиля отображения элементов DIV
var theDIV = document.getElementById('cMsgArea');
console.log('1)' + theDIV.innerHTML);
var divNode = theDIV.firstChild;
console.log('divNode:' + divNode.innerHTML);
console.log("divNodeDisplay:" + divNode.style.display);
console.log("divNodeStyle:" + divNode.style);
while (divNode.style.display !== "block") {
divNode = divNode.nextSibling;
}
return divNode;
результаты консоли:
1)<div style="float:left; clear:left;">[<i>2014.07.05 13:21:09</i>]DreamGuru:(1)(1)</div><div style="float:left; clear:left;">[<i>2014.07.05 13:21:09</i>]DreamGuru:(2)(1)</div><div style="float:left; clear:left;">[<i>2014.07.05 13:21:14</i>]DreamGuru:(1)(12)</div><div style="float:left; clear:left;">[<i>2014.07.05 13:21:14</i>]DreamGuru:(2)(12)</div> si5.js:140
divNode:[<i>2014.07.05 13:21:09</i>]DreamGuru:(1)(1) si5.js:142
divNodeDisplay: si5.js:143
divNodeStyle:[object CSSStyleDeclaration] si5.js:144
Uncaught TypeError: Cannot read property 'style' of null
Вопрос divNode
показывает мне правильное значение для innerHTML
но .style.display
указывает, что стиль является недействительным. Как получить значение style.display?
Обновление Патрик Эванс был прав, я искал неправильный конец проблемы. Тем не менее, это разрешено, но я также хочу отметить, что мне также пришлось внести изменения в код, добавляющий divs в контейнер, чтобы явно добавить, что стиль включает display:block
.
нет той ошибки, указывающей, что вы пытаетесь получить доступ к свойству 'style' на нулевой объект, это означает, что' divNode' имеет нулевое значение, это означает, что в в какой-то момент вы дошли до конца братьев и сестер. вам нужно другое условие в то время: eg 'while (divNode! == null)' и выполнить проверку стиля в блоке while. –
divNode не является нулевым. На консоли отображаются значения innerHTML (si5.js: 142). У меня было предупреждение в цикле while, который правильно прошел через 4 итерации. Сообщение об ошибке указывает, что «стиль» имеет значение NULL. – DreamGuru
Да, но вы делаете журналы innerHTML в первом 'divNode' и перед тем, как перейти в while lopp. И каждая итерация через цикл вы переписываете 'divNode', чтобы быть чем-то вроде' nextSibling'. Поэтому, когда он достигнет последнего сиблинга, 'nextSibling' будет пустым, потому что нет следующего сибилизатора, следовательно, тогда' divNode' будет нулевым в следующей итерации, которая возникает при ошибке. –