Files
OSINT-Cheat-sheet/Script/CNN-News-Scrapping-and-Archive/index.html
T
2026-06-20 14:12:44 +07:00

67 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>CNN News Scrapper</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-dark text-light">
<div class="container mt-5">
<h2 class="mb-4">CNN News Scrapper</h2>
<div id="news-container" class="row"></div>
</div>
<script>
async function loadData() {
try {
const res = await fetch('./cnn_results.json');
const data = await res.json();
const container = document.getElementById('news-container');
data.forEach(article => {
const col = document.createElement('div');
col.className = "col-md-6 mb-4";
col.innerHTML = `
<div class="card bg-secondary text-light h-100">
<div class="card-body d-flex flex-column">
<h5 class="card-title">${article.title}</h5>
<p class="text-warning">${article.date}</p>
<p class="card-text flex-grow-1">
${article.content.substring(0, 200)}...
</p>
<div class="d-flex gap-2 mt-3">
<a href="${article.saved_path}/index.html" target="_blank" class="btn btn-success btn-sm">
Open the Archive
</a>
<a href="${article.url}" target="_blank" class="btn btn-primary btn-sm">
Original Source
</a>
</div>
</div>
</div>
`;
container.appendChild(col);
});
} catch (err) {
document.getElementById('news-container').innerHTML = `
<div class="alert alert-danger">
Failed to load data in json (python -m http.server)
</div>
`;
console.error(err);
}
}
loadData();
</script>
</body>
</html>