Для изменения содержимого сайта в зависимости от ответа от бэкенда вам следует использовать асинхронные запросы к серверу с помощью JavaScript. Примерным способом для этого является использование технологии AJAX (Asynchronous JavaScript and XML) или fetch API.
1. AJAX:
// Создаем объект для выполнения запроса var xhr = new XMLHttpRequest(); // Настраиваем запрос (указываем метод, URL и асинхронность) xhr.open('GET', 'https://www.example.com/data', true); // Указываем, что делать при успешном завершении запроса xhr.onload = function() { if (xhr.status >= 200 && xhr.status < 300) { var responseData = JSON.parse(xhr.responseText); // В зависимости от полученных данных от сервера, изменяем содержимое сайта if (responseData.status === 'success') { document.getElementById('content').innerHTML = '<p>Данные успешно получены!</p>'; } else { document.getElementById('content').innerHTML = '<p>Ошибка получения данных</p>'; } } else { console.error('Ошибка запроса: ' + xhr.status); } }; // Обрабатываем ошибку при выполнении запроса xhr.onerror = function() { console.error('Ошибка выполнения запроса'); }; // Отправляем запрос xhr.send();
2. Fetch API:
// Выполняем GET-запрос с использованием fetch API fetch('https://www.example.com/data') .then(function(response) { if (!response.ok) { throw new Error('Network response was not ok'); } return response.json(); }) .then(function(data) { // В зависимости от полученных данных от сервера, изменяем содержимое сайта if (data.status === 'success') { document.getElementById('content').innerHTML = '<p>Данные успешно получены!</p>'; } else { document.getElementById('content').innerHTML = '<p>Ошибка получения данных</p>'; } }) .catch(function(error) { console.error('Произошла ошибка: ', error); });
Оба примера демонстрируют получение данных от сервера и изменение содержимого сайта в зависимости от ответа бэкенда. Помните, что вам нужно будет адаптировать этот код под конкретный ответ от вашего бэкенда и требования вашего сайта.