@S-a-n-d-r-0

Где лучше хранить html для динамического использования в js?

Пишу свой модуль для битрикс. Модуль должен автоматически добавлять виджет на все страницы сайта. В виджете будет динамический контент, да и html самого виджета тоже нужно где-то хранить. При этом добавить виджет на страницу можно только при помощи js.
Вопрос, какой подход лучше выбрать.
Можно:
1) Добавлять в шапку тег script с аттрибутом type= text/html, и брать шаблон оттуда
2) Добавлять в тело документа теги template или code с display=none и брать шаблон оттуда
3) Запихать шаблон в отдельный файл и грузить аяксом оттуда
4) Шаблонный строки `строка текста ${выражение} строка текста` - не вариант, т.к. не поддерживаются IE.
5) Весь html будет внутри обычной строки js.
Именно последний подход сейчас я и использую. Выглядит примерно так:

const TEMPLATE = '<div class="' + wrapClasses.join(' ') + '">'
        // кнопка вызова формы
        + '<div class="' + buttonClass + '">'
            + 'кнопка'
        + '</div>'

        // шапка виджета
        + '<div class="' + headerClass + '">'
            + '<div class="' + goAdminClass + '"> открыть в админке </div>'
            + '<div class="' + hideClass + '">_</div>'
        + '</div>'
// и т.д.


Но в итоге такой шаблон получился довольно большим и постоянно перерабатывается, и я задался вопросом, может, есть подход получше? Какой способ организовать это самый распространенный и будет понятен любому нормальному разработчику (после меня этот проект унаследуют другие разработчики, не хотелось бы оставлять дерьмо будущим поколениям))
P.S. Библиотеки вроде react и т.п. тут не вариант.
  • Вопрос задан
  • 605 просмотров
Решения вопроса 3
@zkrvndm
Софт для автоматизации
Можно в локальном хранилище сохранить, а затем оттуда тянуть при необходимости. Будет экономия трафика, да и скорость загрузку будет выше.
Ответ написан
AlexanderMarginal
@AlexanderMarginal
Frontend web developer
1. Литеральные строки использовать можно везде, потому что js обрабатывается Babel во время сборки
2. Template использовать нужно
3. Используйте polymer
Ответ написан
Комментировать
gans5131
@gans5131
web-developer
Использую 2-ой указанный вами вариант. Очень удобно, что сначала можно данный шаблон обработать и вывести через php и далее с ним работать в js. Помимо этого, даже если шаблон не используется на странице, то можно снять display:none; и накатить стили оформления.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
TTATPuOT
@TTATPuOT
https://code.patriotovsky.ru/
Почему React не вариант? Он всегда вариант :)
Попроще - mustache.js
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы