Jquery.ready и высота элемента

Может показаться тривиальным вопросом, но я столкнулся с проблемой при использовании jQuery. Когда я пытаюсь получить высоту для элемента внутри .ready, мне всегда присваивается нуль.

$(function() {
  $('#my-elem').height() // Always gives me zero.
});

Если я поставлю код в задержке с помощью setTimeout() вокруг проверки высоты (например,.5s), тогда высота вернется к мне. Я предполагаю, что это связано с тем, что стили еще не имели возможности быть применены?

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

Ответы

Ответ 1

Событие document.ready сигнализирует, что HTML DOM готов для доступа через Javascript, но , что не означает, что элементы уже отображены.

В самом деле, что весь shebang за ready: это средство для вас, чтобы начать манипулировать документом HTML DOM, не дожидаясь завершения загрузки страницы. Можно с уверенностью предположить, что в document.ready ваши элементы еще не отображаются на странице.

Теперь это связано с оговоркой: если элементы еще не отображены, как браузер /Javascript знает, какова его разрешающая высота? .height() может дать нуль при document.ready из-за этого. Вероятно, лучше подождать до load вместо ready, когда дело доходит до вытягивания размеров окна из макета.