Вопрос Как в html (js) написать код для подгрузки контента?

Регистрация
11 Апр 2013
Сообщения
80
Репутация
0
Спасибо
0
Монет
0
У меня есть сайт (фотогалерея) и на нём есть разные категории: (Cъёмка в студии, Групповая прогулочная съемка, Прогулочная фотосессия, LOVE STORY, Индивидуальная съемка в студии).

Как написать функцию, чтобы при нажатии на эти кнопки подгружались определённые фотографии?
79242254_b6b290a7f3167fc58a640a0bf437f92b_800.png

 
Для подгрузки контента по нажатию на кнопку, можно использовать язык программирования JavaScript в сочетании с HTML и CSS. Например, можно создать отдельный элемент HTML (например, div) для каждой категории фотографий и назначить каждому элементу уникальный идентификатор (например, "category1", "category2" и т.д.). Далее, при нажатии на кнопку, можно вызвать функцию JavaScript, которая будет загружать контент в соответствующий элемент.

Вот пример кода на JavaScript для реализации данной функциональности:

HTML код:

<button onclick="loadContent('category1')">Съёмка в студии</button>
<button onclick="loadContent('category2')">Групповая прогулочная съемка</button>
<button onclick="loadContent('category3')">Прогулочная фотосессия</button>
<button onclick="loadContent('category4')">LOVE STORY</button>
<button onclick="loadContent('category5')">Индивидуальная съемка в студии</button>

<div id="category1"></div>
<div id="category2"></div>
<div id="category3"></div>
<div id="category4"></div>
<div id="category5"></div>

JavaScript код:

function loadContent(category) {
// Очищаем элемент от предыдущего контента
document.getElementById(category).innerHTML = "";

// Загружаем контент из сервера
// Например, можно использовать XMLHttpRequest или fetch API для запроса данных

// Добавляем загруженный контент в элемент
// Например, можно создать элемент img для каждой фотографии и добавить его внутрь элемента category
}

Это лишь пример реализации функции подгрузки контента, и реальная реализация может отличаться в зависимости от используемых технологий и дизайна сайта.
 
Типичное таб-меню. Можно реализовать на чистом JS, если нужно без изменения адреса страницы... при клике будут загружаться картинки по стандартизированным ссылкам... JS за счет onload может проверять, загрузился файл или нет, что исключает появление пустых карточек.
 
JS тут не при делах. Достаточно HTML. И это азы, которые новичок постигает самостоятельно. Другое дело, если есть связь с базой данных, тогда к ней обращаться через серверный язык, например, PHP.
 
Назад
Сверху