Как запустить функцию при загрузке страницы?

Я хочу запустить функцию при загрузке страницы, но не хочу использовать ее в теге <body>.

У меня есть скрипт, который запускается, если я инициализирую его в <body>, например, так:

function codeAddress() {
  // code
}
<body onLoad="codeAddress()">

Но я хочу запустить его без <body onload="codeAddress()"> и я пробовал много вещей, например, это:

window.onload = codeAddress;

Но это не работает.

Как же мне запустить его при загрузке страницы?

Комментарии к вопросу (10)
Решение

window.onload = codeAddress; должно работать - [здесь'есть демо](http://jsfiddle.net/NEfR2/), и полный код:




        Test
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript">
        function codeAddress() {
            alert('ok');
        }
        window.onload = codeAddress;
        </script>








        Test
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript">
        function codeAddress() {
            alert('ok');
        }

        </script>




Комментарии (3)

А не с помощью jQuery или окно.события onload, родной JavaScript принял несколько отличных функций с выходом на jQuery. Сейчас все современные браузеры имеют свои готовые функции DOM без использования библиотеки jQuery.

Я'd рекомендую это, если вы используете родной JavaScript.

document.addEventListener('DOMContentLoaded', function() {
    alert("Ready!");
}, false);
Комментарии (9)

Принимаю ответ Darin'a, но в стиле jQuery. (Я знаю, что пользователь просил javascript).

[running fiddle][1]

$(document).ready ( function(){
   alert('ok');
});​
Комментарии (3)

Альтернативным решением. Я предпочитаю это за краткость и простоту кода.

(function () {
    alert("I am here");
})();

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

Комментарии (3)

окна.функцию onload = () {... и т. д. не многие ответят.

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

Более надежный ответ здесь

if(window.attachEvent) {
    window.attachEvent('onload', yourFunctionName);
} else {
    if(window.onload) {
        var curronload = window.onload;
        var newonload = function(evt) {
            curronload(evt);
            yourFunctionName(evt);
        };
        window.onload = newonload;
    } else {
        window.onload = yourFunctionName;
    }
}

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

function my_function() {
    // whatever code I want to run after page load
}
if (window.attachEvent) {window.attachEvent('onload', my_function);}
else if (window.addEventListener) {window.addEventListener('load', my_function, false);}
else {document.addEventListener('load', my_function, false);}

Надеюсь, что это помогает :)

Комментарии (1)

Посмотрите на скрипт domReady, который позволяет установить несколько функций для выполнения после загрузки DOM. По сути, это то, что делает Dom ready во многих популярных библиотеках JavaScript, но он легкий и может быть взят и добавлен в начало вашего внешнего файла сценария.

Пример использования

// add reference to domReady script or place 
// contents of script before here

function codeAddress() {

}

domReady(codeAddress);
Комментарии (0)

окна.события onload будет работать так:

в

function codeAddress() {
    document.getElementById("test").innerHTML=Date();
}
window.onload = codeAddress;



    learning java script
    <script src="custom.js"></script>


    <p id="test"></p>
    <li>abcd</li>

в

Комментарии (0)

Попробуйте readystatechange

document.addEventListener('readystatechange', () => {    
  if (document.readyState == 'complete') codeAddress();
});

где государства являются:

  • загрузка - документ загружается (не стрелял в сниппет)
  • интерактивные - документ анализируется, уволили перед DOMContentLoaded
  • полный - документ и ресурсы загружаются, стрелял в окно.события onload`

в

<script>
  document.addEventListener("DOMContentLoaded", () => {
    mydiv.innerHTML += 'DOMContentLoaded' + '</br>';
  });

  window.onload = () => {
    mydiv.innerHTML += 'window.onload' + '</br>';
  } ;

  document.addEventListener('readystatechange', () => {
    mydiv.innerHTML += 'ReadyState: '+document.readyState + '</br>';

    if (document.readyState == 'complete') codeAddress();
  });

  function codeAddress() {
    mydiv.style.color = 'red';
  }
</script>

<div id='mydiv'></div>

в

Комментарии (0)

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

в

// define the body
var body = document.getElementsByTagName("body")[0];
    // or
    // var body = document.querySelector("body");
    // or 
    // var body = document.querySelectorAll("body")[0];

      function codeAddress() {
      // your function
        alert("Hello World");
    }

    body.onload = function() {
       codeAddress();
    };



    learning java script 


    <h1>Sample Heading</h1>
  <p>Sample text</p>

в

Комментарии (2)