Если Вы уже более-менее знаете JavaScript, то, наверняка, слышали об обработчике события Load, который называется onload. Данное событие срабатывает непосредственно при загрузке страницы. И очень часто при загрузке страницы должна выполняться какая-то функция. Но что делать, если нужно запустить несколько функций JavaScript? Собственно, такой вопрос задал один из пользователей на сайте. Поэтому о запуске нескольких функций в onload, я и напишу в этой статье.
Решение действительно тривиальное, достаточно запустить функцию, в которой запускаются все необходимые другие функции:
Сегодня хочу рассказать об одной проблеме, которая часто возникает у людей, которые начинают изучать Javascript.
Они пытаются взаимодействовать с HTML-элементами на странице, которые находятся ниже по коду, чем сам скрипт. Соответственно, скрипт уже подгрузился, а элемент, с которым нужно будет взаимодействовать, еще нет. По этой причине ничего работать не будет.
Особенность языка Javascript в том, что его код выполняется последовательно, строка за строкой, как они написаны в исходном коде.
К элементу с id #block не будет применяться правило css (background-color:yellow), т.к. строка
Будет выполняться раньше, чем загрузиться html-строка:
Как быть, если нам нужно выполнить код или функцию, только после того, как весь документ полностью загрузится?
Я хочу рассказать о трех способах, как это можно сделать.
1 способ. С использованием библиотеки Jquery.
Чаще всего сам им пользуюсь, наиболее простое и удобное решение, но требует подключения библиотеки Jquery.
Вот как преобразиться предыдущий, код, если мы воспользуемся следующим методом.
2 способ. С помощью элемента body и атрибута onload.
3 способ. С помощью объекта window и его свойства onload.
Выбирайте тот способ, который более всего подходит к вашей ситуации, и применяйте его на практике.
837356 просмотра
8 ответа
3720 Репутация автора
Традиционно, чтобы вызвать функцию JavaScript после загрузки страницы, вы должны добавить onload атрибут к телу, содержащий немного JavaScript (обычно только вызов функции)
Когда страница загрузится, я хочу запустить некоторый код JavaScript для динамического заполнения частей страницы данными с сервера. Я не могу использовать onload атрибут, так как я использую фрагменты JSP, у которых нет body элемента , к которому я могу добавить атрибут.
Есть ли другой способ вызвать функцию JavaScript при загрузке? Я бы предпочел не использовать jQuery, так как я не очень знаком с ним.
Ответы (8)
33 плюса
304060 Репутация автора
Или с помощью jQuery, если вы хотите:
Если вы хотите вызвать более одной функции при загрузке страницы, посмотрите эту статью для получения дополнительной информации:
28 плюса
31977 Репутация автора
Ваш первоначальный вопрос был неясен, при условии, что редактирование / интерпретация Кевина верны, тогда этот первый вариант не применим
Типичные варианты использования onload события:
Вы также можете разместить свой javascript в самом конце тела; он не начнет выполняться, пока документ не будет готов.
И еще один вариант — рассмотреть возможность использования инфраструктуры JS, которая по сути делает это:
Автор: STW Размещён: 01.10.2010 07:59
307 плюса
6340 Репутация автора
Если вы хотите, чтобы метод onload принимал параметры, вы можете сделать что-то похожее на это:
Это связывает onload с анонимной функцией, которая при вызове будет запускать желаемую функцию с любыми параметрами, которые вы ей предоставите. И, конечно же, вы можете запустить более одной функции изнутри анонимной функции.
50 плюса
1662 Репутация автора
Другой способ сделать это — использовать прослушиватели событий, вот как вы их используете:
DOMContentLoaded Это означает, что когда объекты DOM документа полностью загружены и видны в JavaScript, это также может быть «щелчок», «фокус» .
function () Анонимная функция, будет вызываться при возникновении события.
6 плюса
1103 Репутация автора
Вы должны вызвать функцию, которую вы хотите вызвать при загрузке (т. Е. Загрузку документа / страницы). Например, функция, которую вы хотите загрузить, когда загрузка документа или страницы называется «yourFunction». Это можно сделать, вызвав функцию загрузки события документа. Пожалуйста, смотрите код ниже для более подробной информации.
Источник: