Edit in JSFiddle

function munculkanDialog() {
  // Alert untuk memunculkan dialog
  alert("Munculkan alert menggunakan fungsi.");
}

function updateKonten() {
	// dapatkan HTML elemen via ID...
	var konten = document.getElementById('konten');
  var sumber = document.getElementById('sumber');
  // Ganti teks #konten dengan masukan #sumber
  konten.innerText = sumber.value;
}

bg_sekarang = 0; 

// Daftar background via array
daftar_bg = [
	'pic_trulli.jpg', 
  'img_girl.jpg', 
  'img_chania.jpg'
];

function gantiBackground() {
  // Loop ++ 1 nomor background
	bg_sekarang = (bg_sekarang + 1) % daftar_bg.length;
  // Set background
  document.body.style.backgroundImage = `url(https://www.w3schools.com/html/${daftar_bg[bg_sekarang]})`;
}
<button onclick="alert('Halo dunia 👋')">
Munculkan dialog salam
</button>
<button onclick="munculkanDialog()">
Munculkan dialog via fungsi
</button>

<button onclick="gantiBackground()">
Ganti Bg
</button>
 
<textarea id="sumber" oninput="updateKonten()" placeholder="ketik disini..."></textarea>
<p id="konten">
</p>
body {
  /* Tengah Full */
  background-position: center;
  background-size: cover;
  /* Full tanpa scrollbar, karena margin body 8px, alhasil -16px */
  height: calc(100vh - 16px);
}

button, textarea {
   display: block;
   padding: 5px;
   width: 90%;
   resize: vertical;
}