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?

javascript html css

— rajasekar
kaynak

Bu soru meta üzerinde tartışılıyor.

— Script47

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("");

— Tom Gullen
kaynak

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

@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);
}

— Mikrofon
kaynak

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

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

— yazardım

@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

tek bir astar olarakwhile(div.firstChild && div.removeChild(div.firstChild));

— Russell Elfenbein