@Black_Fire

Как вывести на фронт вёрстку из массива с первым элементом по умолчанию?

Допустим, есть вёрстка с бутстрапом, на странице пристутствует скрытый элемент
<div class="d-none card">
    <h3 class="header"></h3>
    <p class="text1"></p>
    <p class="text2"></p>
</div>


В результате запроса на сервер приходит, например, такой массив объектов:
[
    {
        header: "header1",
        text1: "text1",
        text2: "text2"
    },
    {
        header: "header2",
        text1: "text1",
        text2: "text2"
    },
    {
        header: "header3",
        text1: "text1",
        text2: "text2"
    },
    {
        header: "header4",
        text1: "text1",
        text2: "text2"
    },
    {
        header: "header5",
        text1: "text1",
        text2: "text2"
    },
]

Нужно, чтобы в скрытый элемент вёрстки записывались данные из первого объекта, вёрстка ставала видимой, а потом она нужное количество раз скопировалась на фронте для оставшихся элементов массива, и в эти скопированные блоки вставились соответствующие данные.
  • Вопрос задан
  • 151 просмотр
Решения вопроса 1
sergiks
@sergiks Куратор тега JavaScript
♬♬
Вместо невидимого элемента лучше обернуть заготовку разметки в тег <template> — из него можно забирать готовый DocumentFragment, который клонировать и наполнять данными.
Класс невидимости убрать за ненадобностью.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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