Как запустить код JavaScript, как только элемент <body>определен? - PullRequest
Новая
       23

Как запустить код JavaScript, как только элемент <body>определен?

0 голосов
/ 20 февраля 2019

Вот мой код: 

<!DOCTYPE html>
<html>
<head>
  <title>Foo</title>
</head>
<body>

  <script>
    console.log('test')
  </script>

  <p>
    Foo
  </p>

</body>
</html>

Я хочу переместить JavaScript в этом коде из <body> в <head>.Вот моя неправильная попытка: 

<!DOCTYPE html>
<html>
<head>
  <title>Foo</title>
  <script>
  window.onload = function () {
    console.log('test')
  }
  </script>
</head>
<body>

  <p>
    Foo
  </p>

</body>
</html>

Это, конечно, не то, что я хочу.Он запускает JavaScript только после загрузки всей страницы.Но я хочу, чтобы JavaScript запускался, как только определено <body>.Можно ли это сделать в JavaScript?

1 Ответ

0 голосов
/ 21 февраля 2019

Вставьте команду log в определенную функцию Javascript в части <head> вашего HTML и вызовите эту функцию вскоре после открытия <body>.

Ваш окончательный код будет выглядеть следующим образом: 

<!DOCTYPE html>
<html>
<head>

<script>
function myFunction(){
  console.log('test');
}
</script>

<title>Foo</title>
</head>

<body>

<script>
  myFunction();
</script>

<p>
Foo
</p>

</body>
</html>

Стоит отметить, что свойство события onload существует и в других HTML-тегах, и только вв тех случаях это выполняется сразу после его определения, что означает: немедленно.

С тегом <body> происходит нечто особенное: onload запускается только после двух условий:

1) точное определение </body>;

2) завершение загрузки всех дополнительных и, возможно, внешних подпрограмм и ресурсов, что означает: загрузка всех html, css, jpg, gif, svg и т. д.

Итак, onload делает то, что обещает: запускает , когда и только после страница загружена на 100%.

...