[javascript] TableSorter를 이용한 테이블의 특정 셀의 값 변경하기

TableSorter는 자바스크립트 플러그인으로, HTML 테이블을 다양한 방식으로 정렬하고 필터링할 수 있습니다. 기본적으로 테이블의 셀 값을 변경하는 기능은 내장되어 있지 않지만, 몇 가지 방법을 사용하여 특정 셀의 값을 동적으로 변경할 수 있습니다.

TableSorter 테이블 셀 값 변경 방법

TableSorter 플러그인을 사용하여 특정 셀의 값을 변경하는 방법을 알아보겠습니다.

  1. 셀 값 변경하기

    먼저, jQuery를 사용하여 TableSorter 테이블의 특정 셀 값을 변경할 수 있습니다. 다음은 예시 코드입니다.

     // jQuery를 사용하여 첫 번째 행의 두 번째 셀의 값을 '새로운 값'으로 변경
     $('table').find('tbody tr:first-child td:nth-child(2)').text('새로운 값');
    
  2. 셀 값 업데이트 후 정렬하기

    테이블의 값을 변경한 후에는 TableSorter에게 테이블을 재정렬하도록 지시해야 합니다.

     // TableSorter에게 테이블을 다시 정렬하도록 지시
     $('table').trigger('update');
    

이제 TableSorter를 사용하여 HTML 테이블의 특정 셀 값을 동적으로 변경하는 방법을 알게 되었습니다. 여기서 주의할 점은 TableSorter가 초기화된 후에 값을 변경하고 테이블을 다시 정렬해야 한다는 것입니다.

더 많은 정보를 원하시면 TableSorter 공식 문서를 참고하시기 바랍니다.


참고 문서: