Храните ваш javascript внутри отдельного файла, сохраняйте ваши CSS внутри отдельного файла и делайте ссылки на них из вашего HTML. Порядок этих ссылочных файлов относительно HTML не имеет значения. Что касается PHP, я бы не стал сильно беспокоиться о его смешивании с HTML (просто храните ваши функции, классы и другие скрипты в отдельных файлах и включайте их с PHP в заголовок).
Если на каждой странице используется один и тот же CSS, наличие внешнего кэшируемого файла помогает сэкономить пропускную способность. Если существуют разные правила, смешанные с HTML для разных типов элементов, у вас могут возникнуть некоторые конфликты, но если вы перепишете его, это в конечном итоге станет намного чище и его будет проще поддерживать позже.
Мне нравится сохранять структуру файла примерно так:
index.php
/css
main.css
othercssfiles.css
/javascript
main.js
otherjsfiles.js
/template
header.php
footer.php
/scripts
functions.php
otherscripts.php
Тогда в моем заголовочном файле я бы разместил HTML-код, ссылающийся на файлы в каталогах css и javascript. И в корневой каталог мой файл index.php будет включать (); верхний колонтитул вверху и нижний колонтитул внизу.
«otherjsfiles.js» и «othercssfiles.css» можно использовать в тех случаях, когда для отдельной страницы может быть определенное требование, требующее много CSS и JavaScript, которые не нужны большинству других страниц. Это означает, что другим страницам не нужно извлекать ненужные данные, и он хранит код конкретной страницы отдельно от всего кода сайтов.
Мне показалось, что это простой способ отслеживать различные аспекты кода, составляющего HTML-страницу, но, естественно, вы найдете способы организовать его, который имеет смысл для вас.
Отредактировано:
Если несколько файлов JavaScript и CSS
должны быть ссылки, как включить
в одиночку или тег?
Было бы лучше объединить их в один файл для сохранения HTTP-запросов (которые занимают время). Тогда вы просто включите эти файлы CSS и JavaScript, как обычно.
<script type="text/javascript" src="/javascript/main.js"></script>
<link rel="stylesheet" href="/css/main.css">
Кроме того, кажется, что вы можете использовать службы CSS beautifier для удобства чтения, JavaScript beautifier для удобства чтения и JavaScript minifier , когда вы находитесь закончил чтение (сохранил читаемую версию) и хочу сохранить пропускную способность. Эти инструменты особенно полезны, когда вы работаете над поддержкой сайта, который вы не создали.