Новости

.news-section { padding: 40px 20px; } .news-section h2 { text-align: center; margin-bottom: 30px; } .news-item { background-color: #f1f1f1; padding: 20px; margin-bottom: 20px; border-radius: 5px; } .news-item h3 { margin-top: 0; } .news-item p { margin-bottom: 10px; } .news-item .date { color: #888; font-size: 14px; } const newsContainer = document.getElementById('news-container'); // Ключ API от NewAPI.org const apiKey = '206a22cbbfd34110b7ccfa59ae57474e'; // Функция для создания элемента новости function createNewsItem(news) { const newsItem = document.createElement('div'); newsItem.classList.add('news-item'); const titleElement = document.createElement('h3'); titleElement.textContent = news.title; const descriptionElement = document.createElement('p'); descriptionElement.textContent = news.description; const dateElement = document.createElement('p'); dateElement.classList.add('date'); dateElement.textContent = news.publishedAt; newsItem.appendChild(titleElement); newsItem.appendChild(descriptionElement); newsItem.appendChild(dateElement); return newsItem; } // Функция для получения новостей с API function getNews() { fetch(`https://api.newapi.org/v1/news?apiKey=${apiKey}`) .then(response => response.json()) .then(data => { data.articles.forEach(article => { const newsItem = createNewsItem({ title: article.title, description: article.description, publishedAt: article.publishedAt }); newsContainer.appendChild(newsItem); }); }) .catch(error => { console.error('Ошибка при загрузке новостей:', error); }); } // Вызов функции для получения новостей getNews();
Made on
Tilda