Uncaught TypeError: Cannot read property 'remove' of null

halo,

Saya punya kode seperti dibawah. tetapi eror di google chrome menyatakan sebagai berikut kira kira salahnya dimana ya ?

eror.png

eror1.png

<script type='text/javascript'>
// media query event handler
if (matchMedia) {
const mq = window.matchMedia("(max-width: 1100px)");
mq.addListener(WidthChange);
WidthChange(mq);
}
// media query change
function WidthChange(mq) {
if (mq.matches) {
const h = document.querySelector('.right-bar');
h.insertAdjacentHTML("afterend", "<div class='header-mobile'><label class='show-menu-btn' for='chk'><i class='fas fa-align-justify'/></label><label class='hide-menu-btn' for='chk'><i class='fas fa-times'/></label><label class='search-menu-btn' for='check'><i class='fas fa-search'/></label><label class='tutup-menu-btn' for='check'><i class='fas fa-times'/></label></div>");
// ambil semua element icon
const ambil = document.querySelector('.hide-menu-btn');
const ambil1 = document.querySelector('.show-menu-btn');
const ambil2 = document.querySelector('.search-menu-btn');
const ambil3 = document.querySelector('.tutup-menu-btn');
// hilangkan icon tutup
ambil.style.display = 'none';
ambil3.style.display = 'none';
// menambahkan element p HTML header
ambil1.addEventListener("click",function(){
const l = document.querySelector('#search-box');
l.insertAdjacentHTML("afterend", "<p id='cons'>TERHUBUNG KE ADMIN</p>");
const divbaru = document.createElement('p');
const tulisanbaru = document.createTextNode("2020@admin.com All right reserved");
divbaru.appendChild(tulisanbaru);
const d1 = document.querySelector('.right-bar');
d1.appendChild(divbaru);
d1.style.left = '0';
ambil1.style.display = 'none';
ambil.style.display = 'block';
});

ambil.addEventListener("click",function(){
const k = document.querySelector('#cons');
k.remove();
const e = document.querySelector('.right-bar p');
e.remove();
ambil.style.display = 'none';
ambil1.style.display = 'block';
const f = document.querySelector('.right-bar');
f.style.left = '-101%';
});

} else {
const g = document.querySelector('.header-mobile');
  g.remove();
  const a = document.querySelector('.right-bar');
  a.style.left = &#39;-101%&#39;;
  const m = document.querySelector('#cons');
  m.remove();
  const z = document.querySelector('.right-bar p');
  z.remove();
}
}
</script>
avatar sempadanbintan_google
@sempadanbintan_google

3 Kontribusi 1 Poin

Diperbarui 4 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

<div>ada kemungkinan hasil dari document.querySelector itu null.<br>jadi cek dahulu sebelum melakukan remove()</div><pre>const g = document.querySelector('.header-mobile'); if (g !== null) { g.remove(); }</pre>

avatar soeleman
@soeleman

120 Kontribusi 147 Poin

Dipost 4 tahun yang lalu

Tanggapan

terima kasih mas, keren langsung bisa hehee :D

Login untuk ikut Jawaban