Сценарий - это небольшой фрагмент программы, который может добавить интерактивности вашему веб-сайту. Например, сценарий может создать всплывающее окно с предупреждением или предоставить раскрывающееся меню. Этот сценарий может быть написан с использованием JavaScript или VBScript.
Вы можете написать различные небольшие функции, называемые обработчиками событий, используя любой язык сценариев, а затем запускать эти функции с помощью атрибутов HTML.
В настоящее время большинство веб-разработчиков используют только JavaScript и связанные с ним платформы, VBScript даже не поддерживается различными основными браузерами.
Вы можете хранить код JavaScript в отдельном файле, а затем включать его везде, где это необходимо, или вы можете определить функциональность внутри самого HTML-документа. Давайте рассмотрим оба случая один за другим на подходящих примерах.
Если вы собираетесь определить функциональность, которая будет использоваться в различных HTML-документах, то лучше сохранить эту функциональность в отдельном файле JavaScript, а затем включить этот файл в ваши HTML-документы. Файл JavaScript будет иметь расширение .js и будет включен в файлы HTML с помощью тега
<script>Представьте, что мы определяем небольшую функцию, используя JavaScript в script.js, которая имеет следующий код:
function Hello() {
alert("Hello, World");
}
Теперь давайте воспользуемся приведенным выше внешним файлом JavaScript в нашем следующем HTML-документе:
<!DOCTYPE html>
<html>
<head>
<title>Javascript External Script</title>
<script src = "/html/script.js" /></script>
</head>
<body>
<input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
</body>
</html>
Это приведет к следующему результату, где вы можете попытаться нажать на данную кнопку:
Вы можете написать код скрипта прямо в HTML-документ. Обычно мы сохраняем код скрипта в шапке документа с помощью тега
<script>в противном случае ограничений нет, и вы можете разместить исходный код в любом месте документа, но внутри тега
<script><!DOCTYPE html>
<html>
<head>
<title>JavaScript Internal Script</title>
<base href = "https://www.tutorialspoint.com/" />
<script>
function Hello() {
alert("Hello, World");
}
</script>
</head>
<body>
<input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
</body>
</html>
Это приведет к следующему результату, где вы можете попытаться нажать на данную кнопку:
Обработчики событий — это не что иное, как просто определенные функции, которые можно вызывать при любом событии мыши или клавиатуры. Вы можете определить свою бизнес-логику внутри обработчика событий, который может варьироваться от одной до 1000 строк кода.
В следующем примере объясняется, как написать обработчик событий. Давайте напишем одну простую функцию EventHandler() в заголовке документа. Мы будем вызывать эту функцию, когда любой пользователь наведет указатель мыши на абзац.
<!DOCTYPE html>
<html>
<head>
<title>Event Handlers Example</title>
<base href = "https://basicit.org/" />
<script>
function EventHandler() {
alert("I'm event handler!!");
}
</script>
</head>
<body>
<p onmouseover = "EventHandler();">Bring your mouse here to see an alert</p>
</body>
</html>
Теперь это даст следующий результат. Наведите указатель мыши на эту строку и посмотрите на результат:
Хотя большинство (если не все) браузеров в наши дни поддерживают JavaScript, некоторые старые браузеры все же не поддерживают его. Если браузер не поддерживает JavaScript, вместо запуска вашего скрипта он отобразит код пользователю. Чтобы предотвратить это, вы можете просто разместить HTML-комментарии вокруг скрипта, как показано ниже.
JavaScript Example:
<script>
<!--
document.write("Hello JavaScript!");
//-->
</script>
VBScript Example:
<script type = "text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
<noscript>
Вы также можете предоставить альтернативную информацию пользователям, чьи браузеры не поддерживают скрипты, и тем пользователям, которые отключили скрипты в своих браузерах. Сделать это можно с помощью тега
<noscript>JavaScript Example:
<script>
<!--
document.write("Hello JavaScript!");
//-->
</script>
<noscript>Your browser does not support JavaScript!</noscript>
VBScript Example:
<script type = "text/vbscript">
<!--
document.write("Hello VBScript!")
'-->
</script>
<noscript>Your browser does not support VBScript!</noscript>