Modul 8 Project 1
PROJECT
• Buat sebuah halaman yang terdiri dari 2 input: Angka Pertama dan Angka Terakhir.
• Jika button diklik, maka generator bilangan prima antara Angka Pertama dan Angka Terakhir (tidak termasuk kedua angka tersebut) dalam bentuk table.
• Gunakan array untuk menampung data bilangan prima
• Catatan: bilangan prima adalah bilangan yang hanya bisa dibagi oleh 1 dan dirinya sendiri.
Kode :
HTML + JS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Modul 8 P1</title>
<link rel="stylesheet" href="m8.css">
</head>
<body>
<h1>Generator Bilangan Prima</h1>
<form id="primeForm">
<label for="startNumber">Angka Pertama:</label>
<input type="number" id="startNumber" name="startNumber" required><br><br>
<label for="endNumber">Angka Terakhir:</label>
<input type="number" id="endNumber" name="endNumber" required><br><br>
<button type="button" onclick="generatePrimes()">Generate</button>
</form>
<h2>Bilangan Prima</h2>
<div id="result">
<table id="primeTable">
<thead>
<tr>
<th>Bilangan Prima</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script>
function isPrime(num) {
if (num <= 1) return false;
if (num === 2) return true;
if (num % 2 === 0) return false;
for (let i = 3; i <= Math.sqrt(num); i += 2) {
if (num % i === 0) return false;
}
return true;
}
function generatePrimes() {
const startNumber = parseInt(document.getElementById('startNumber').value);
const endNumber = parseInt(document.getElementById('endNumber').value);
const primeArray = [];
for (let i = startNumber + 1; i < endNumber; i++) {
if (isPrime(i)) {
primeArray.push(i);
}
}
const tableBody = document.querySelector("#primeTable tbody");
tableBody.innerHTML = "";
primeArray.forEach(prime => {
const row = document.createElement('tr');
const cell = document.createElement('td');
cell.textContent = prime;
row.appendChild(cell);
tableBody.appendChild(row);
});
}
</script>
</body>
</html>
CSS
table {
width: 25%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: center;
}
HASIL
.png)
.png)
.png)
.png)
Komentar
Posting Komentar