[javascript] HTML 표의 모든 행 삭제

<th>Javascript를 사용 하고 테이블의 모든 행을 반복하지 않고 HTML 테이블의 모든 행을 삭제하려면 어떻게 해야합니까? 나는 매우 큰 테이블을 가지고 있고 그들을 삭제하기 위해 행을 반복하는 동안 UI를 고정하고 싶지 않습니다.

답변

킵 <th>A의 행 <thead>A의 다른 행을 <tbody>다음을 대체 할 <tbody>새로운 하늘의 하나.

즉

var new_tbody = document.createElement('tbody');
populate_with_new_rows(new_tbody);
old_tbody.parentNode.replaceChild(new_tbody, old_tbody)

답변

그러면 모든 행이 제거됩니다.

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

답변

매우 조잡하지만 이것은 또한 작동합니다.

var Table = document.getElementById("mytable");
Table.innerHTML = "";

답변

이것은 오래된 질문이지만 최근에 비슷한 문제가 발생했습니다.
이 코드를 작성하여 해결했습니다.

var elmtTable = document.getElementById('TABLE_ID_HERE');
var tableRows = elmtTable.getElementsByTagName('tr');
var rowCount = tableRows.length;

for (var x=rowCount-1; x>0; x--) {
   elmtTable.removeChild(tableRows[x]);
}

첫 번째 행을 제외한 모든 행이 제거됩니다.

건배!

답변

참고 포인트, 온 일반적인 실수에 대한 시계 아웃 :

시작 색인이 0 (또는 시작부터의 일부 색인)이면 올바른 코드는 다음과 같습니다.

var tableHeaderRowCount = 1;
var table = document.getElementById('WRITE_YOUR_HTML_TABLE_NAME_HERE');
var rowCount = table.rows.length;
for (var i = tableHeaderRowCount; i < rowCount; i++) {
    table.deleteRow(tableHeaderRowCount);
}

노트

1. deleteRow에 대한 인수가 고정되어 있습니다.

이는 행을 삭제할 때 행 수가 감소하기 때문에 필요합니다.
즉; 내가 도달 할 때 (rows.length-1), 또는 해당 행이 이미 삭제되기 전에도 오류 / 예외 (또는 자동 예외)가 발생합니다.

2. for 루프가 시작되기 전에 rowCount가 취해집니다.
“table.rows.length”를 삭제하면 계속 변경되므로 집니다. 따라서 홀수 또는 짝수 행만 삭제된다는 문제가 있습니다.

도움이 되었기를 바랍니다.

답변

테이블이 하나만 있다고 가정하여 유형만으로 참조 할 수 있습니다. 헤더를 삭제하지 않으려면 :

$("tbody").children().remove()

그렇지 않으면:

$("table").children().remove()

도움이 되길 바랍니다!

답변

@strat가 게시 한 첫 번째 및 솔루션을 제외한 모든 행을 삭제해야했지만 잡히지 않은 예외가 발생했습니다 (존재하지 않는 컨텍스트에서 노드 참조). 다음은 나를 위해 일했습니다.

var myTable = document.getElementById("myTable");
var rowCount = myTable.rows.length;
for (var x=rowCount-1; x>0; x--) {
   myTable.deleteRow(x);
}