JavaScript kullanarak div içeriğini nasıl silebilirim? [kapalı]


152

Kullanıcı sayfamdaki bir düğmeyi tıkladığında, div'nin içeriği temizlenmelidir. Bunu nasıl başarabilirim?


Yanıtlar:


270

Sadece Javascript (istendiği gibi)

Bu işlevi sayfanızda bir yere ekleyin (tercihen <head>)

function clearBox(elementID)
{
    document.getElementById(elementID).innerHTML = "";
}

Ardından tıklama etkinliğine düğmeyi ekleyin:

<button onclick="clearBox('cart_item')" />

JQuery'de (referans için)

JQuery'yi tercih ederseniz şunları yapabilirsiniz:

$("#cart_item").html("");

50
alternatif jQuery:$("#cart_item").empty();
Rob Allen

.Detach () işlevini de kullanabilir misiniz?
RyanP13

@Tom Gullen bu benim için DIV kimliğini işleve geçirmeden ve fonksiyonun kendisindeki elementID etrafında tek tırnak işareti ile çalıştı. Bunun için teşekkürler!
DPSSpatial

3
@Tom Gullen: lütfen bu div içindeki düğümlerle ilişkili olay işleyicilerini kaldırmaz.
bhavya_w

@Mic'in yanıtı yaklaşık 250 kat daha hızlı. jsperf.com/innerhtml-vs-removechild
tleb

108

Bunu DOM yolu ile de yapabilirsiniz:

var div = document.getElementById('cart_item');
while(div.firstChild){
    div.removeChild(div.firstChild);
}

1
Birinci sınıf! JQuery ile aynı: $ ("# cart_item"). Empty (); yalnızca içerik üzerinde değil DOM üzerinde de etkili. Harika!
Pedro Ferreira

Bu tercih edilir innerHTML = ''mi ve öyleyse neden?
Sukima

1
bu daha temiz hissettiriyor innerHTML = ''. Şahsen fazladan birkaç satır
yazardım

1
@Sukima bu şekilde tercih edilen cevaptan daha hızlıdır, bu yüzden kısa kod yerine daha iyi performansa ihtiyacınız varsa bu sizin seçiminizdir.
iiic

1
tek bir astar olarakwhile(div.firstChild && div.removeChild(div.firstChild));
Russell Elfenbein
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.