Использование JavaScript

<script> тег

В HTML, код JavaScript должен быть расположен в <script> с </script> между тегами.

Пример

<script>
document.getElementById("demo").innerHTML = "Мой первый段 JavaScript";
</script>

попробовать самому

Комментарий:旧的 JavaScript 例子也许会使用 Старые примеры JavaScript могут использовать тип

Комментарий:свойство: <script type="text/javascript">.

Атрибут type не обязателен. JavaScript является defaultным языком скрипта в HTML.

JavaScript функции и события JavaScriptфункция

Это блок JavaScript-кода, который может быть выполнен при вызове.Например, когда происходитсобытие

Совет:при событии, например, когда пользователь нажимает кнопку.

Вы узнаете больше о функциях и событиях в следующих разделах.

JavaScript в тегах <head> или <body>

Вы можете поместить любое количество скриптов в документ HTML. <body> или <head> Скрипт можно поместить в

JavaScript в теге <head> части, или и того, и другого.

В этом примере JavaScript-функция находится в <head> часть.

Эта функция будет вызываться, когда кнопку нажимают:

Пример

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Текст абзаца изменен.";
}
</script>
</head>
<body>
<h1>Одна веб-страница</h1>
<p id="demo">Этот абзац</p>
<button type="button" onclick="myFunction()">Попробуйте</button>
</body>
</html>

попробовать самому

JavaScript в теге <body> страницы HTML

В этом примере JavaScript-функция находится в <body> часть.

Эта функция будет вызываться, когда кнопку нажимают:

Пример

<!DOCTYPE html>
<html>
<body> 
<h1>Страница Веба</h1>
<p id="demo">Этот абзац</p>
<button type="button" onclick="myFunction()">Попробуйте</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Текст абзаца изменен.";
}
</script>
</body>
</html>

попробовать самому

Совет:Поместите скрипт в <body> внизу элемента, что может улучшить скорость отображения, так как компиляция скрипта может замедлить отображение.

Внешние скрипты

Скрипт можно поместить в файл с внешним содержимым:

Внешний файл: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Текст абзаца изменен.";
}

Внешние скрипты очень полезны, если один и тот же скрипт используется на многих различных веб-страницах.

Расширение файла JavaScript файлов является .js.

Если вы хотите использовать внешние скрипты, пожалуйста <script> тега src (источник) свойстве:

Пример

<script src="myScript.js"></script>

попробовать самому

Вы можете определить имя скрипта в атрибуте <head> или <body> Размещение ссылки на внешние скрипты.

Поведение этого скрипта зависит от того, где он размещен <script> Такой же, как и в теге.

Комментарий:Внешние скрипты не могут содержать <script> теги

Преимущества внешнего JavaScript

Преимущества размещения скрипта в внешнем файле:

  • Отделил HTML и код
  • Сделает HTML и JavaScript более читаемыми и поддерживаемыми
  • Загруженные JavaScript файлы могут ускорить загрузку страницы

Если нужно добавить несколько скриптов в одну страницу - используйте несколько тегов script:

Пример

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

Внешние ссылки

Внешние скрипты можно ссылаться через полный URL или путь по отношению к текущей странице:

Этот пример использует полный URL для подключения к скрипту:

Пример

<script src="https://www.codew3c.com/js/myScript1.js"></script>

попробовать самому

Этот пример использует скрипт из указанной папки на текущем сайте:

Пример

<script src="/js/myScript1.js"></script>

попробовать самому

Этот пример связан с текущей страницей в той же папке:

Пример

<script src="myScript1.js"></script>

попробовать самому

Вы можете Путь к HTML файлуУзнайте больше о пути к файлу здесь.