# \`while\` & HTML

{% hint style="info" %}
untuk penjelasan tentang for bisa lihat kembali pada materi ini [perulangan-dengan-while](https://alvan.kitakale.id/fundamental-php/perulangan/perulangan-dengan-while "mention")
{% endhint %}

Disini kita akan melakukan perulangan dengan menggunakan while dan menggunakan HTML. Dengan menggunakan studi kasus jika kita ingin menampilkan angka dari 1 - 10.

#### Kode:

```php
<?php
$i = 1;
while ($i <= 10) : ?>
    <h1>Angka: <?= $i; ?></h1>
    <?php $i++;
endwhile; ?>
```

#### Penjelasan:

1. **Inisialisasi Variabel:**

   ```php
   $i = 1;
   ```

   * Variabel `$i` diinisialisasi dengan nilai 1. Ini adalah langkah pertama sebelum memulai loop. Variabel ini akan digunakan sebagai penghitung atau counter dalam loop.
2. **Perulangan `while`:**

   ```php
   while ($i <= 10) :
   ```

   * `while` adalah struktur perulangan yang akan terus berjalan selama kondisi yang diberikan bernilai `true`.
   * Kondisi yang diperiksa adalah `$i <= 10`. Artinya, loop akan berjalan selama nilai `$i` kurang dari atau sama dengan 10.
3. **Blok Kode di Dalam Loop:**

   ```php
   <h1>Angka: <?= $i; ?></h1>
   ```

   * Pada setiap iterasi loop, kode HTML ini akan dijalankan.
   * Tag `<h1>` digunakan untuk menampilkan angka dalam format heading besar.
   * `<?= $i; ?>` adalah singkatan dari `<?php echo $i; ?>`, yang akan menampilkan nilai variabel `$i` pada halaman web. Ini digunakan untuk menampilkan angka saat ini dalam loop.
4. **Increment (Penambahan Nilai Variabel):**

   ```php
   <?php $i++;
   ```

   * Setelah setiap iterasi, nilai variabel `$i` ditingkatkan (di-increment) sebesar 1 menggunakan `$i++`.
   * Ini memastikan bahwa pada setiap iterasi berikutnya, nilai `$i` bertambah, dan loop akan berhenti ketika `$i` melebihi 10.
5. **Akhir dari Loop:**

   ```php
   endwhile; ?>
   ```

   * `endwhile;` menandakan akhir dari blok `while`.
   * Ketika loop berakhir (ketika kondisi `$i <= 10` tidak lagi terpenuhi), eksekusi program keluar dari loop.

#### Output:

* Kode ini akan menghasilkan 10 baris heading (`<h1>`) yang masing-masing menampilkan angka dari 1 hingga 10. Setiap angka akan berada pada baris yang berbeda, seperti ini:

```makefile
Angka: 1
Angka: 2
Angka: 3
...
Angka: 10
```

#### Kesimpulan:

* Loop `while` ini berfungsi untuk menampilkan angka 1 sampai 10 secara berurutan pada halaman web dengan setiap angka berada dalam tag `<h1>`.
* Setelah loop selesai (ketika `$i` menjadi 11), program akan berhenti mengeksekusi perulangan dan tidak ada lagi angka yang ditampilkan.