Window.onload vs <body onload = "/" >

В чем разница между событием window.onload и событием onload тега body? когда я буду использовать, и как это сделать правильно?

ОТВЕТЫ

Ответ 1

window.onload = myOnloadFunc и <body onload="myOnloadFunc();"> - это разные способы использования того же события. Использование window.onload менее навязчиво, хотя - он выводит ваш JavaScript из HTML.

Все общие библиотеки JavaScript, Prototype, ExtJS, Dojo, JQuery, YUI и т.д. предоставляют хорошие обертки вокруг событий, которые возникают при загрузке документа. Вы можете прослушивать событие onLoad окна и реагировать на это, но onLoad не запускается, пока не будут загружены все ресурсы, поэтому обработчик событий не будет выполнен до тех пор, пока не будет извлечено последнее огромное изображение. В некоторых случаях, что именно вы хотите, в других случаях вы можете обнаружить, что прослушивание, когда DOM готово, более уместно - это событие похоже на onLoad, но запускается без ожидания изображений и т.д. Для загрузки.

Ответ 2

Нет никакой разницы, но вы также не должны использовать.

Во многих браузерах событие window.onload не запускается до тех пор, пока все изображения не будут загружены, а это не то, что вы хотите. У браузеров, основанных на стандартах, есть событие с именем DOMContentLoaded, которое срабатывает раньше, но IE не поддерживается (на момент написания ответа). Я бы рекомендовал использовать библиотеку javascript, которая поддерживает функцию перекрестного браузера DOMContentLoaded, или найти хорошо написанную функцию, которую вы можете использовать. jQuery $(document).ready(), является хорошим примером.

Ответ 3

window.onload может работать без тела. Создайте страницу только с тегами script и откройте ее в браузере. Страница не содержит никакого тела, но она все еще работает.

<script>
  function testSp()
  {
    alert("hit");
  }
  window.onload=testSp;
</script>

Ответ 4

Обычно я предпочитаю не использовать событие <body onload="" > . Я думаю, что это чище, чтобы как можно больше отделять поведение от контента.

Тем не менее, есть случаи (обычно довольно редкие для меня), где использование нагрузки на тело может дать небольшое ускорение скорости.

Мне нравится использовать Prototype, поэтому я обычно помещаю что-то вроде этого в <head > моей страницы:

document.observe("dom:loaded", function(){
  alert('The DOM is loaded!');
});

или

Event.observe(window, 'load', function(){
  alert('Window onload');
});

Выше были трюки, которые я узнал здесь. Я очень люблю концепцию прикреплять обработчики событий за пределами HTML.

(Изменить, чтобы исправить орфографическую ошибку в коде.)

Ответ 5

'так много субъективных ответов на объективный вопрос. "Ненавязчивый" JavaScript - это суеверие, как прежнее правило, чтобы никогда не использовать gotos. Напишите код таким образом, чтобы вы могли надежно выполнить свою цель, а не согласно модным религиозным убеждениям.

Любой, кто находит:

 <body onload="body_onload();">

чтобы быть слишком отвлекающим, чрезмерно претенциозно и не имеет приоритетов прямо.

Обычно я помещаю свой JavaScript-код в отдельный .js файл, но я не нахожу ничего громоздкого в том, что вы подключаете обработчики событий в HTML, что является допустимым HTML-кодом.

Ответ 6

Существует разница нет...

Так что в принципе вы можете использовать оба (по одному за раз!)

Но для удобства чтения и для чистоты html-кода я всегда предпочитаю window.onload! o]

Ответ 7

window.onload - Вызывается после того, как все DOM, JS файлы, Картинки, Ифраметры, Расширения и другие полностью загружены. Это равно $(window).load(function() {});

body onload="" - Вызывается после загрузки DOM. Это равно $(document).ready(function() {});

Ответ 8

Если вы пытаетесь написать ненавязчивый JS-код (и вы должны быть), вы не должны использовать <body onload="">.

Я понимаю, что разные браузеры обрабатывают эти два немного по-другому, но они работают аналогичным образом. В большинстве браузеров, если вы определяете оба, один будет проигнорирован.

Ответ 9

Думайте о загрузке, как и любой другой атрибут. Например, в поле ввода вы можете поставить:

<input id="test1" value="something"/>

Или вы могли бы позвонить:

document.getElementById('test1').value = "somethingelse";

Атрибут onload работает одинаково, за исключением того, что вместо значения, соответствующего атрибуту value, он принимает функцию как свое значение. Это также объясняет, почему вы можете "использовать только один из них" - вызов window.onload переназначает значение атрибута onload для тега body.

Кроме того, как говорят другие, как правило, чище держать стиль и javascript отдельно от содержимого страницы, поэтому большинство людей советуют использовать window.onload или как функцию jQuery ready.

Ответ 10

< body onload = "" > следует переопределить window.onload.

С < body onload = " > , document.body.onload может иметь значение null, undefined или функцию, зависящую от браузера (хотя getAttribute (" onload") должен быть несколько последовательным для получения тела анонимная функция как строка). С помощью window.onload, когда вы назначаете ему функцию, window.onload будет функцией последовательно в браузерах. Если это имеет значение для вас, используйте window.onload.

window.onload лучше всего отделяет JS от вашего контента. Там не так много причин для использования < body onload = "" > в любом случае, когда вы можете использовать window.onload.

В Opera целевой объект для window.onload и < body onload = " > (и даже window.addEventListener(" load", func, false)) будет вместо этого окна, как в Safari и Firefox. Но 'this' будет окном в браузерах.

Это означает, что, когда это имеет значение, вы должны обернуть crud и сделать вещи согласованными или использовать библиотеку, которая сделает это за вас.

Ответ 11

Оба они работают одинаково. Однако обратите внимание, что если оба определены, будет вызван только один из них. Обычно я избегаю использовать любой из них напрямую. Вместо этого вы можете присоединить обработчик события к событию загрузки. Таким образом, вы можете легко интегрировать другие JS-пакеты, которые также могут потребовать присоединения обратного вызова к событию onload.

Любая инфраструктура JS будет иметь кросс-браузерные методы для обработчиков событий.

Ответ 12

Это общепринятый стандарт, позволяющий разделить содержимое, макет и поведение. Поэтому window.onload() будет более подходящим для использования, чем <body onload="">, хотя обе выполняют ту же работу.

Ответ 13

если вы хотите манипулировать DOM определенно использовать < body onload = "" > . таким образом, событие будет запущено при загрузке DOM. Кроме того, существует лаг между событием window.onload и загрузкой DOM, поэтому вы можете завершить манипулирование объектом, который не существует.  я бы предложил использовать jquery и $(document).ready(function(){}). Это будет работать для лучших