jQuery 테이블 마지막 행에 행 추가하는 방법

질문 : jQuery에 테이블 행 추가

---

테이블에 추가 행을 마지막 행으로 추가하는 jQuery에서 가장 좋은 방법은 무엇입니까?

이것이 허용됩니까?

$('#myTable').append('<tr><td>my data</td><td>more data</td></tr>');

이와 같은 테이블에 추가 할 수있는 항목 (예 : 입력, 선택, 행 수)에 제한이 있습니까?

답변

---

당신이 제안한 접근 방식이 당신이 찾고있는 결과를 보장 할 수는 없습니다. 예를 들어 tbody

<table id="myTable">
  <tbody>
    <tr>...</tr>
    <tr>...</tr>
  </tbody>
</table>

결국 다음과 같이됩니다.

<table id="myTable">
  <tbody>
    <tr>...</tr>
    <tr>...</tr>
  </tbody>
  <tr>...</tr>
</table>

따라서 대신이 방법을 권장합니다.

$('#myTable tr:last').after('<tr>...</tr><tr>...</tr>');
                          

위의 예에 따라 여러 행을 포함하여 유효한 HTML 인 after() 메서드 내에 모든 것을 포함 할 수 있습니다.

업데이트 : 이 질문에 대한 최근 활동에 따라이 답변을 다시 방문하십시오. eyelidlessness는 DOM에 tbody 가있을 것이라는 좋은 코멘트를합니다. 이것은 사실이지만 최소한 하나의 행이있는 경우에만 해당됩니다. 행이 없으면 직접 지정하지 않는 한 tbody

DaRKoN_ tr 뒤에 콘텐츠를 추가하는 대신 tbody 추가하는 것을 제안 합니다. 이것은 행이없는 문제를 해결하지만 이론적으로 여러 tbody 요소를 가질 수 있고 행이 각각에 추가 될 수 있기 때문에 여전히 방탄이 아닙니다.

모든 것을 고려해 보면 가능한 모든 시나리오를 설명하는 단일 단선 솔루션이 있는지 잘 모르겠습니다. 마크 업에 jQuery 코드가 포함되어 있는지 확인해야합니다.

가장 안전한 해결책은 행이 없더라도 table 항상 마크 업에 적어도 하나의 tbody 이를 기반으로 다음을 사용할 수 있습니다. 이는 보유한 행 수에 관계없이 작동합니다 (여러 tbody 요소도 고려).

$('#myTable > tbody:last-child').append('<tr>...</tr><tr>...</tr>');
                          

출처 : https://stackoverflow.com/questions/171027/add-table-row-in-jquery