Как подключить js к html через link
Перейти к содержимому

Как подключить js к html через link

  • автор:

Тег script

Тег script подключает JavaScript к HTML странице (а также, намного реже, и другие скрипты).

Можно подключать отдельный JavaScript файл (в этом случае должен быть указан атрибут src ) или же писать JavaScript прямо на HTML странице. По сути script ведет себя как тег link и тег style одновременно, только не для CSS, а для JavaScript.

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

Данный тег должен размещаться внутри тега head , однако это не обязательно — тег script можно разместить и внутри тега body и это будет работать.

Атрибуты и свойства

Атрибут/свойство Описание
src Путь к подключаемому файлу.
type Тип данных подключаемого файла. Для JavaScript следует использовать text/javascript. В HTML5 это не обязательно.
language Задает язык скрипта. Данный атрибут осуждается, а вместо него следует применять атрибут type.
defer Атрибут defer откладывает выполнение скрипта до тех пор, пока вся страница не будет загружена полностью. Пользоваться так: или так .

Как правильно подключить js файл к html в контексте flask?

Привет!
Тут у меня затык в подключении файла script1.js
Я пытался подключить следующими методами и в шапке и низу всего html кода:

>" rel="stylesheet"> 

Но получаю ошибку функции clicer() которая активируется при нажатии кнопки:

606f4f0410dcc190746773.png

CSS методом ниже, подключается на ура. С js они находятся в одной и той же папке STATIC (как по мануалу flask)

Если js вписать в сам html то все прекрасно работает.

606f50586bda1240873772.png

Сама структура папок и файлов:

Почему html упорно не хочет видеть локальный js файл?

  • Вопрос задан более двух лет назад
  • 1562 просмотра

#11 – Теги для подключения файлов

#11 – Теги для подключения файлов

В HTML есть два тега, что позволяют выполнить подключение CSS и JavaScript файлов. В уроке мы с вами изучим работу с тегами: «link» и «script».

Видеоурок

Подключение стилей

HTML тег head существует для создания описания страницы, а также для подключения стилей и скриптов. Чтобы к странице подключить CSS стили требуется использовать специальный тег link , который дополнительно не требует закрывающего тега и выглядит следующим образом:

В атрибуте href необходимо указывать полный путь к CSS файлу. Также необходимо добавлять атрибуты rel и type для указания информации о том, что конкретно находится в подключаемом файле.

Добавление скриптов на сайт

Помимо стилей мы также можем подключать различные скрипты. Они помещаются в теге . В атрибуте src можно указать полный путь к файлу со скриптом или же вы можете прописать JavaScript внутри тега «script».

Важно также понимать, что некоторые скрипты не всегда нужны при загрузке страницы. По этой причине их загрузку можно отложить на самый конец. Чтобы это сделать необходимо добавить скрипты не вначале кода страницы (не в теге head), а в конце страницы перед закрывающим тегом body . Кстати, такая же схема не подходит для подключения стилей. Они всегда должны находиться в теге head .

Описание сайта в meta-тегах

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

К некоторым основным мета-тегам можно отнести такие: тег с описанием страницы, тег с ключевыми словами, тег с указанием кодировки сайта.

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

Весь код будет доступен после подписки на проект!

Подключение сторонних JS и PHP скриптов

Для подключения JS и CSS в шаблонах и плагинах обязательно используйте функцию mgAddMeta(), для того чтобы подключаемые скрипы учитывались при формировании HTML страниц шаблона и участвовали в алгоритмах движка.

 mgAddMeta(''); ?>  mgAddMeta(''); ?> 

При таком подключении, независимо от того в каком месте программы сторонние скрипты будут объявлены, их можно будет вывести в нужное место верстки шаблона. Например, в теге или перед закрываюшим тегом

  mgMeta("meta","css","jquery"); ?> // Выведет блок подключаемых стилей и метаданных  . .  mgMeta("js"); ?> // Выведет блок подключаемых JS 

Опция для сжатия CSS и JS в один файл, предустморенная в настройках движка учитывает только файлы подключаемые с помощью mgAddMeta().

Подключение PHP

Чтобы использовать самописные php скрипты для обработки тех или иных событий в moguta.cms, можно создать php файл в папке mg-pages
Поместите в папку mg-pages скрипт myscript.php, после этого он будет доступен при обращении к сайту http://site.ru/myscript как будто он находится в корне сайта.

Чтобы использовать PHP скрипты напрямую из корня сайта, минуя работу движка, необходимо добавить иключающие правила для используемых php скриптов в файле .htaccess после строки #RewriteBase / .

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *