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

  • Сценарий в разделе head ... /head.
  • Сценарий в разделе body ... /body.
  • Скрипт в разделах body ... /body и head>... /head.
  • Сценарий во внешнем файле, а затем включить в раздел head ... /head.

В следующем разделе мы увидим, как мы можем поместить JavaScript в файл HTML по-разному.

JavaScript в разделе head ... /head

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

<html>
    <head>
  
      <script type="text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>
     
   </head>
  
   <body>
      <input type="button" onclick="sayHello()" value="Say Hello" />
   </body>
  
</html>

JavaScript в разделе body ... /body

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

<html>
   <head>
   </head>
   <body>
  
      <script type="text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
     
      <p>This is web page body </p>
     
   </body>
</html>

JavaScript в body и head разделах

Вы можете поместить свой код JavaScript в раздел head и body в целом следующим образом:

<html>
   <head>
      <script type="text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>
   </head>
  
   <body>
      <script type="text/javascript">
         <!--
            document.write("Hello World")
         //-->
      </script>
     
      <input type="button" onclick="sayHello()" value="Say Hello" />
     
   </body>
</html>

JavaScript в внешнем файле

Когда вы начнете более активно работать с JavaScript, вы, скорее всего, обнаружите, что есть случаи, когда вы повторно используете идентичный код JavaScript на нескольких страницах сайта.

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

Вот пример, показывающий, как вы можете включить внешний JavaScript-файл в свой HTML-код с помощью тега script и его атрибута src.

<html>
 
   <head>
      <script type="text/javascript" src="/filename.js" ></script>
   </head>
  
   <body>
      .......
   </body>
</html>

Чтобы использовать JavaScript из внешнего источника файла, вам нужно записать весь исходный код JavaScript в простой текстовый файл с расширением «.js», а затем включить этот файл, как показано выше.

Например, вы можете сохранить следующий файл в файле filename.js, а затем вы можете использовать функцию sayHello в своем HTML-файле после включения файла filename.js.

function sayHello() {
   alert("Hello World")
}

Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!



Cookies make it easier for us to provide you with our services. With the usage of our services you permit us to use cookies.
Ok