Когда выполняется document.ready, когда обрабатывается встроенный JS? - PullRequest
1 голос
/ 20 января 2010

У меня есть страница, где я импортирую большинство моих js в разделе <head>. Однако на главной странице есть встроенный JavaScript.

В одном из моих скриптов, импортированных в <head>, у меня есть $(document).ready..., который использует некоторые переменные JS, определенные на странице. Насколько я могу видеть, это работает, как я и ожидал - $(document).ready не сталкивается ни с какими ошибками, используя JS-переменные, определенные inline.

Однако я получил от пользователей несколько отчетов о том, что они видят ошибку «не определено» в коде внутри моего $(document).ready, где я ссылаюсь на переменную, определенную в строке на странице.

Я подозреваю, что это поведение браузера, но я не уверен. Я не нашел этого явно в документации, поэтому кто-то может подтвердить, что можно использовать переменные, определенные inline на странице в $(document).ready в JS, извлеченной из <head>?

Ссылка на ваш источник сделает ваш ответ более правдоподобным. :)

Спасибо!

Ответы [ 4 ]

6 голосов
/ 20 января 2010

Под капотом: $ (документ) .ready ()

Как и следовало ожидать от Джона Резига, метод jQuery для определения готовности DOM использует ряд оптимизаций.

Например, если браузер поддерживает событие DOMContentLoaded (как это делают многие браузеры, не относящиеся к IE), то это событие сработает. Тем не менее, IE не может безопасно запускать, пока не будет завершено выполнение документа readyState, что обычно происходит позже.

Если ни одна из этих оптимизаций недоступна, window.onload вызовет событие

Источник: здесь

3 голосов
/ 20 января 2010

Почему бы не разместить тег «script» в конце тега «body», который запускает ваше приложение.
Делая это, вы уверены, что все готово для запуска (кросс-браузер и кросс-библиотека).

<html>
  ...
  <script>startApp('param');</script>
</body>
</html>

"startApp" - это функция, определенная где-либо ранее, либо встроенная, либо в теге "head".

1 голос
/ 20 января 2010

$(document).ready() использует разные методы для разных браузеров. Не слишком много браузеров согласны с тем, как обрабатывать это событие, поэтому существует несколько способов его тестирования. Я уверен, что реализация jQuery, по крайней мере, IE hack , зависит от вставки фрагмента и проверки его на свойство doScroll("left"), которое должно существовать только после того, как DOM будет готов. Это недокументированное поведение, которое может измениться в более новых версиях IE.

Цель $(document).ready() - позволить вам запустить зависимый от DOM JavaScript до завершения загрузки страницы, поскольку window.onload не запускается, пока не будет загружена вся страница.

Различные реализации также имеют различные уровни надежности. Похоже, что один из браузеров запускает скрипт до того, как он заканчивает загрузку.

Имейте в виду, что порядок запуска встроенного JavaScript не обязательно должен предшествовать ready. Для меня это звучит так, как будто вы должны объединить свои встроенные сценарии в обратный вызов $(document).ready(). JQuery делает все возможное, но не идеально.

1 голос
/ 20 января 2010

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

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

В javascript кодирование предположений о том, когда что-то произойдет, рискованно, так же как предположить, что свойство или функция, которую вы хотите использовать, существует, рискованно, поэтому вам нужно кодировать очень осторожно.

Возможно, вы захотите поместить встроенный javascript в функции и вызвать его из функции ready или, по крайней мере, установить флаг, чтобы встроенный код знал, что теперь его можно безопасно запускать.

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

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