Относительный путь к файлу не работает в JavaScript

Question

Я пытаюсь заставить страницы загружаться быстрее, включая встроенный CSS для кода выше сгиба. Это работает для страниц, хранящихся в корневом каталоге, но у меня проблема с загрузкой остальной части CSS-файла в конце страниц, которые находятся в подпапках (т.е. http://example.com/other/index.html).,

Если текущий файл находится в корневой папке, следующий код работает нормально:

   <script>var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = 'css/a1tg2.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame ||
webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);</script>

но если текущий файл находится в подпапке, следующий код не работает:

 <script>var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = '../css/a1tg2.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame ||
webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);</script>

Кроме того, если я пробую абсолютный путь, он также не работает:

   <script>var cb = function() {
var l = document.createElement('link'); l.rel = 'stylesheet';
l.href = 'http://example.com/css/a1tg2.css';
var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
};
var raf = requestAnimationFrame || mozRequestAnimationFrame ||
webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);</script>

Относительное расположение файла является правильным, потому что, если у меня есть следующая строка в заголовке документа:

<link href="../css/a1tg2.css" rel="stylesheet" type="text/css">

Это также хорошо работает, но я не хочу использовать это, поскольку это замедляет рендеринг страницы. Я не разбираюсь в JavaScript, просто получаю код, требуемый от генератора CSS критического пути в Интернете. Может кто-нибудь предложить решение, пожалуйста, так как ни один из подобных вопросов на этом сайте не имеет удовлетворительного ответа.

Answer 1

Проверьте ссылку на созданный HTML-файл и используйте путь относительно этой страницы. Например: если ваша структура каталогов:

 - css
    - a1tg2.css
- pages
   - header.php
   - footer.php
- index.php

Если вы включаете header.php в index.php, относительный путь к файлу css в header.php должен быть css/a1tg2.css, а не../css/a1tg2.css