Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
cara set data jadi kosong lgi gimana stlh appendchild data
cara pertama saya menggunakan DOM createElement dan berhasil tp setiap di klik jd double data, cara kedua saya menggunakan variable content += biasa buat ngerender ke html biasa tapi anehnya data nya keluar cuma data yang terahkir, saya lagi bikin sistem search pk firebase saya ga nemu validasinya temen" bisa bantu mungkin..
// cara pertama
function renderProducts(doc) {
var div = document.createElement('div')
var h3 = document.createElement('h3')
var p = document.createElement('p')
var a = document.createElement('a')
div.setAttribute('class', 'column is-one-third')
h3.setAttribute('class', 'title')
p.setAttribute('class', 'subtitle price')
a.setAttribute('class', 'link')
a.setAttribute('href', doc.data().url)
a.setAttribute('target', '_blank')
h3.textContent = doc.data().title
p.textContent = doc.data().price
a.textContent = doc.data().url)
div.appendChild(h3)
div.appendChild(p)
div.appendChild(a)
var products = productsList.appendChild(div)
}
// cara kedua
function renderProducts(doc) {
var el = document.getElementsByClassName('columns')[0]
var _content = ''
_content +=
"<div class='column is-one-third'>" +
"<h3 class='title'>"+ doc.data().title + "</h3>" +
"<img class='image' src=" + doc.data().img + ">" +
"<p class='subtitle price'>"+ doc.data().price + "<img id='dollar-tag'
src='assets/images/dollar-tag.png'>" + "</p>" +
"<a class='link' href="+ doc.data().url + "target='_blank'>" + 'There is link' + "</a>" +
"</div>"
el.innerHTML = _content
}
1 Jawaban:
Jawaban Terpilih
udah solved gan :D, ternyata begini caranya, saya nemu dua cara, yg pertama : saya cek bagian parent nya, kalo productsList.appendChild(div) ga null alias ada saya removeChild, ini berhasil tapi dpt error di console.log walaupun jln tpi sy kurang puas, Nah, yang kedua ini yg ga tricky lah istilah nya, saya kasih class bagian parent kedua di div nya terus milih pk document.querySelectorAll() di forloop terus di remove()
function renderProducts(doc)
{
// cara kedua
var productListings = document.querySelectorAll('.productListing');
for (var i = 0; i <productListings.length; i++) {
productListings[i].remove();
}
var div = document.createElement('div')
var h3 = document.createElement('h3')
var img = document.createElement('img')
var p = document.createElement('p')
var tagPrice = document.createElement('img')
var a = document.createElement('a')
h3.setAttribute('class', 'title')
p.setAttribute('class', 'subtitle price')
img.setAttribute('class', 'image')
img.setAttribute('src', doc.data().img)
tagPrice.setAttribute('id', 'dollar-tag')
tagPrice.setAttribute('src', 'assets/images/dollar-tag.png')
a.setAttribute('class', 'link')
a.setAttribute('href', doc.data().url)
a.setAttribute('target', '_blank')
h3.textContent = doc.data().title
p.textContent = doc.data().price
a.textContent = doc.data().url
var wrap = document.createElement('div')
wrap.innerHTML =
"<p class='subtitle price'>" + doc.data().price + "<img id='dollar-tag' src='assets/images/dollar-tag.png'>" + "</p>"
div.appendChild(h3)
div.appendChild(img)
div.appendChild(wrap)
div.appendChild(a)
// cara kedua
div.className = 'column is-one-third productListing'
productsList.appendChild(div)
// cara pertama
if (productsList.appendChild(div) !== null) {
maleBtn.addEventListener('click', function() {
productsList.removeChild(div)
})
}
}