Html macro | ||||
---|---|---|---|---|
| ||||
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RSS Feed Reader</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
.rss-item {
margin-bottom: 15px;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
}
.rss-item h3 {
margin: 0;
}
.rss-item p {
margin: 5px 0 0;
}
</style>
</head>
<body>
<h1>RSS Feed Reader</h1>
<div id="rss-feed"></div>
<script>
const rssUrl = 'https://www.nasa.gov/news-release/feed/'; // Replace with your RSS feed URL
async function fetchRSSFeed(url) {
try {
const response = await fetch(`https://api.rss2json.com/v1/api.json?rss_url=${encodeURIComponent(url)}`);
if (!response.ok) {
throw new Error('Failed to fetch RSS feed');
}
const data = await response.json();
displayRSSFeed(data.items);
} catch (error) {
console.error('Error fetching RSS feed:', error);
document.getElementById('rss-feed').innerText = 'Failed to load RSS feed.';
}
}
function displayRSSFeed(items) {
const feedContainer = document.getElementById('rss-feed');
feedContainer.innerHTML = '';
items.forEach(item => {
const feedItem = document.createElement('div');
feedItem.classList.add('rss-item');
feedItem.innerHTML = `
<h3><a href="${item.link}" target="_blank">${item.title}</a></h3>
<p>${item.description}</p>
<small>${new Date(item.pubDate).toLocaleDateString()}</small>
`;
feedContainer.appendChild(feedItem);
});
}
fetchRSSFeed(rssUrl);
</script>
</body>
</html> |
Content Comparison
General
Content
Integrations