Как загрузить CSS стили из файла с расширением html?
Так получилось, что все js и css файлики стали с расширениями html
js можно загрузить с любым расширением. Например так <script async src="cart.html" type="text/javascript"> </script> то c CSS так не получится :agree: браузер ругается и требует расширение css <link rel="stylesheet" href="static.html"> есть какой-нибудь javascript костыль, котый бы загружал стили независимо от расширения файла. файлики лежат в одной папке на компьютере. |
Цитата:
|
это очень долгая и запутанная история. Есть одна большая страничка http://tiddlywiki.ru/test/heeg.html#static_cut через bloob она нарезает из себя много маленьких. Может нарезать html css js типо генератор сайта, но нарезает она все очень шустро в папку Download (а там уже много чего лежит), а если поставить в настройках "спрашивать", то приходится кликать тысячу раз на каждом файле. Второй недостаток - не перезаписывает файлы а добавляет (1) (2) (3).
Все недостатки скачивания можно допилить маленьким расширеним на хром например такого https://chrome.google.com/webstore/d...kcokgcdkoplbfm оно отлично скачивает все что угодно и даже создает папку js, но все равно пихает в него файлики с расширением html. это какой-то глюк самого хрома и его API, потому что если папку не указывать все работает нормально. А если с папкой, то одни html сыпятся. пока придумал только css во время генерации превращать в js и грузить как html :write: var mycss = ` .tc-modal-header .slideshow-wrap{ margin: 0px; position: inherit; border: none; box-shadow: none; overflow:hidden; } `; <style id="test"></style> <script async src="static.html" type="text/javascript"> </script> но там нужно \\ вместо \ делать и вообще как-то туповатенько всё... |
Немного костылей и говнокода:
<srcipt src="cssloader.js" href="static.html"></script>Где "static.html" - css файл, а "cssloader.js" - примерно такой скрипт: (function(){ var xhr = new XMLHttpRequest(); var href = (document.currentScript || document.scripts[document.scripts.length-1]).getAttribute('href'); xhr.open('GET', href, false); xhr.send(null); document.head.insertAdjacentHTML('beforeend', '<style>' + xhr.responseText + '</style>'); }()); Чуть лучше, если вы это где-то сервите, а не запускаете локально - написать специальные правила проставления нужного mime-type для нужных имён файлов. По хорошему же - разобраться с вашим генератором. |
Цитата:
from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https. моя задумка с var тоже не подошла. страницы при переходе все время "моргают" когда стили подгружаются.... |
Да, почему-то был уверен что заработает, даже проверять не стал. Видать последний раз в лохматом году, когда я подобным занимался, браузеры ещё не задалбывали со своей "безопасностью" где не просят. Собсно и css грузить они отказались не так давно...
Если у вас есть доступ к генерации, то идея с подключением как скрипт имеет право на жизнь в примерно таком виде: (function(){ var css = (function(){ /* * { background: #000; color: #fff } */ }).toString(); css = css.slice(css.indexOf('/*')+2, css.lastIndexOf('*/')); document.write('<style>', css, '</style>') }());Тут следует обратить внимание на 3 вещи: 1. Классический костыль для многострочного текста в js через комментарий и получение текста функции. При таком походе не надо париться об экранировании, единственное что важно - чтоб в css не было своих комментариев. 2. Использование document.write, который плюёт данные прямо в поток, что вызывает их обработку на лету - чтоб не было "моргания". 3. <script> должен быть ни в коем случае не async - опять же, чтоб не было "моргания". P.S. Идея починить генератор - всё ещё актуальна. Если вы лично не имеете доступа - напишите автору. |
Цитата:
вся проблема была в type: "octet/stream" я везде как осотонелый пихал type: "text/css"а оно вон оно чо |
Часовой пояс GMT +3, время: 19:20. |