Кроссбраузерный импорт для шаблонов HTML

Я проверил, и здесь есть «похожие» вопросы, но я хочу исключить полифил Google для веб-компонентов, а также время прошло с момента большинства дискуссий 2015 года, и, что наиболее важно, модули Javascript, похоже, исключили себя из предоставления " функциональность шаблона импорта. (Придерживайтесь импорта VAR, функций и объектов только из других модулей)

Итак, на мой вопрос: -

«Какое кросс-браузерное решение рекомендуется/наилучшее для импорта/включения HTML-шаблонов?»

Я не вижу ничего плохого с точки зрения функциональности в Chrome <LINK TYPE="IMPORT">, но, к сожалению, Safari, Firefox и Edge, похоже, исключили это :-(

Так что дальше лучше?

XHR2 responseType="document?

XHR type="text/html" 
document.createElement("template").innerHTML = responseText
document.headd.appendChild(newTemplate);
?

<script id="storeStringsHere></script> ?

Что-нибудь еще?

ShadowDOM V1.0, Шаблоны, Модули и даже Пользовательские Компоненты, похоже, все это делает. (Это здорово!), но поскольку импорт HTML запрещен, нам/мне нужно альтернативное кросс-браузерное решение. Пожалуйста помоги.

Почему LINK подходит для CSS, но не для шаблонов?


javascript html web-component shadow-dom
person McMurphy    schedule 12.05.2017    source источник
comment
Пожалуйста, определите немного больше, что вы на самом деле хотите от этого. Вы можете каким-то образом связать с файлом, хорошо, хорошо, но как он будет использоваться после этого? HTML не имеет собственного способа (пока) разместить этот шаблон в любом месте основного документа.   -  person deceze♦    schedule 12.05.2017
comment
@deceze Это просто работает: - html5rocks.com/en/tutorials/webcomponents/imports, но IMPORT не имеет такой кросс-браузерной поддержки и, похоже, никогда не будет. Для тех, кто согласен со мной в том, что HTML-шаблоны никуда не денутся, пожалуйста, помогите.   -  person McMurphy    schedule 12.05.2017

Ответы (1)


arrow_upward
0
arrow_downward

Поскольку собственного решения не существует, использование импорта HTML (собственного или полифиллированного) является таким же хорошим решением, как и любое другое (XMLHttpRequest, fetch, другая библиотека JS) для импорта шаблонов в виде файлов HTML.

В любом случае HTML Imports polyfill, как и любая другая JS-библиотека Module Loader, использует XMLHttpRequest под деревом. Так что не рассматривайте его как полифилл, а просто как еще один загрузчик модулей JS.

В качестве альтернативы вы можете реализовать свой собственный загрузчик модулей с помощью XMLHttpRequest (или fetch). Всего несколько строк кода.

person Supersharp    schedule 12.05.2017
comment
ИМХО, глядя на код полифилла, это вредоносное ПО, чтобы взломать орех :-( XHR - это лишь крошечная часть обширных возможностей смягчения последствий. Думаю, я выберу XHR, но мне было интересно, какой вариант инкапсуляции был бы лучшим для модуля ES6 с Shadow DOM и локальный CSS? - person McMurphy; 13.05.2017
comment
Модули ES6 работают только с файлами JS, поэтому единственный вариант здесь — использовать полные пользовательские элементы JS с шаблонами, определенными как литералы шаблонов. - person Supersharp; 13.05.2017
comment
Я согласен с тем, что модули не предлагают новых функций импорта шаблонов, что оставляет меня в недоумении, чтобы объяснить непокорность Safari, Firefox и Edge в поддержке LINK IMPORT. Кажется, они единодушны в своем презрении к предлагаемой функции Chrome, но никто не объясняет, почему и какая альтернатива :-( - person McMurphy; 14.05.2017
comment
@McMurphy, я согласен с тобой - person Supersharp; 15.05.2017