açık masa jquery


105

Bir var bir HTML tablosu satırla dolu tablom var.

Tablodan tüm satırları nasıl kaldırabilirim ?

Yanıtlar:


164

.Remove () kullanın

$("#yourtableid tr").remove();

Verileri çıkardıktan sonra bile ileride kullanmak için saklamak istiyorsanız .detach () kullanabilirsiniz.

$("#yourtableid tr").detach();

Satırlar tablonun alt öğesiyse, alt seçici yerine alt seçici kullanabilirsiniz, örneğin

$("#yourtableid > tr").remove();

16
sonuncusuna dikkat edin: çoğu tarayıcı tbody, tröğelerin etrafına örtük bir öğe ekler .
nickf

97

Verileri temizlemek, ancak başlıkları korumak istiyorsanız:

$('#myTableId tbody').empty();

Tablo şu şekilde biçimlendirilmelidir:

<table id="myTableId">
    <thead>
        <tr>
            <th>header1</th><th>header2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>data1</td><td>data2</td>
        </tr>
    </tbody>
</table>

bu işe yarıyor, ancak bu, içindeki tüm 'tr' ile 'tbody'nin kendisini kaldırıyor.
Hakan Fıstık

Haklısın @HakamFostok. Cevabımı bunun yerine empty () kullanacak şekilde düzenledim
HoffZ

41

Her birini tek tek çıkarmaktan biraz daha hızlı:

$('#myTable').empty()

Teknik olarak bu kaldıracak thead, tfootve tbodyçok unsurları.



12

Nükleer seçenek:

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

İçindeki her şeyi yok eder #yourtableid. Seçicilerinize dikkat edin, çünkü geçtiğiniz seçicideki tüm html'leri yok eder!


2
Nükleer için +1 :). Ama bunun 'en iyi' tarz olmadığını anlamalıyım :) Genel olarak bunu tavsiye etmem
Budda

lol. Kabul. Geçmişte bu özel yöntemi hız ve zor durumları çözmek için kullandım . JQuery uygulamaları alanında bazı geçerli kullanımı vardır.
KevinDeus

11
$("#employeeTable td").parent().remove();

Bu, tüm çocuk sahibi trolmayı ortadan kaldıracaktır td. yani başlık dışındaki tüm satırlar silinecektir.


Bu benim için çalışan tek kişi. Başlık hariç hepsini sil ...
Elbert Villarreal

6

Bu, gövdeye ait tüm satırları kaldıracak, böylece başlıkları ve gövdeyi sağlam tutacaktır:

$("#tableLoanInfos tbody tr").remove();

1
<table id="myTable" class="table" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
        </tr>
    </thead>
    <tbody id="tblBody">

    </tbody>
</table>

Ve Kaldır:

$("#tblBody").empty();


0

Böyle bir masaya sahip olmak (başlık ve gövde ile)

<table id="myTableId">
    <thead>
    </thead>
    <tbody>
   </tbody>
</table>

#tableId içinde tbody adında bir ebeveyni olan her tr'yi kaldırın

$('#tableId tbody > tr').remove();

ve tablonuza eklemek isterseniz tam tersi

$('#tableId tbody').append("<tr><td></td>....</tr>");
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.