Форум

Самовар · #1 (**permalink**) 22.03.2022, 22:05

Например есть меню или модельное окно, сладер и тд, которое создано в трех файлах: html, css, js. Необходимо вынести его в отдельные файлы. Соответсвенно отденый js файл, отдельный css файл. с Этими двумя всё понятно. Но как вынести разметку html в отдельный файл? Ну то есть например, чтобы бы созданное и скрытое модальное окно не болталось в основном html файле, а лежало отдельно, в другом html файле.

ksa · #2 (**permalink**) 22.03.2022, 22:27

Сообщение от Самовар

Но как вынести разметку html в отдельный файл?

Можно использовать шаблонизаторы... Такие как, например, pug.
https://zaurmag.ru/html5-css3/html-p...-pug-jade.html

Или применить метод jQuery load()
https://basicweb.ru/jquery/jquery_method_load.php

voraa · #3 (**permalink**) 22.03.2022, 22:48

А смысла?
Ну может и есть какой то смысл, для отдельной секции, которая не всем нужна, и пользователь то ли захочет ее посмотреть, то ли нет.
Но не меню же, которое по любому должно быть.
Выделение в отдельный файл с последующей загрузкой увеличивает время от обращения, до полной загрузки и показа страницы. Это не есть хорошо.
Нервирует же, когда появляется одна часть страницы, потом вдруг еще какой то кусок врезается и раздвигает то, что уже видно....

Самовар · #4 (**permalink**) 23.03.2022, 13:32

А как для отдельной секции сделать, например, для всплывающего окна?

voraa · #5 (**permalink**) 23.03.2022, 20:13

Ну держать этот html код в отдельном файле. Не важно с каким расширением, хоть .txt, хоть .html
Затем через fetch считать этот файл, как текст и вставить куда надо, через innerHTML.
Если с этим куском связаны какие то css и js, то их надо считывать отдельно. Создать в <head> элементы <link> для CSS и <script> для js. И назначить им соответствующиe url

Только все равно смысл не понятен. Что это экономит?
При первом вызове окна будет заметная задержка.

Форум

Справочник

Discord чат

Курсы javascript