table sort js
1.22.1
설명 : 정렬 유형 추론 내장 및 브라우저 확장 기능이있는 HTML 테이블 분류 라이브러리. #vanillajs
데모
선적 서류 비치. (진행중인 작업)
NPM 패키지. 및 JSDELIVR
Firefox 및 Chrome 브라우저 확장 : 방문 할 웹 사이트의 테이블은 정렬 가능합니다!
< script src = "https://cdn.jsdelivr.net/npm/table-sort-js/table-sort.min.js" > </ script >또는 비 사업 버전 (더 큰 크기이지만 디버그하기 쉽다!) : :
< script src = "https://cdn.jsdelivr.net/npm/table-sort-js/table-sort.js" > </ script >HTML과 함께 테이블-스ort-J를 사용하는 방법에 대한 예
npm install table - sort - js import tableSort from "table-sort-js/table-sort.js" ;React.js 및 vue.js와 같은 프론트 엔드 프레임 워크와 함께 테이블-스ort-JS 사용에 관한 예
class="table-sort" html <table> 태그에 추가하십시오.| <테이블> 클래스 | 설명 |
|---|---|
| "테이블 소트" | 테이블을 정렬 가능하게 만드십시오! (단어, 숫자, 날짜, 파일 크기) ... |
| "테이블 화살" | 오름차순 또는 내림차순 화살표를 표시합니다. 사용자 정의 화살표를 지원합니다. 예를 들면 : "Table-Arrows-" |
| "No Class-Infer" | 정렬 클래스를 자동으로 추가하기위한 추론을 꺼집니다 (파일 크기-소트, 데이트-디트) 등. |
| "기억" | 다른 열을 클릭하면 원래 열을 기억합니다. |
| "Cells-Sort" | 테이블 행 (TR)이 아닌 정렬 셀 (TD); 클래스/속성이있는 테이블 행을 유지하는 데 유용합니다. |
| <th> 수업 | 설명 |
|---|---|
| "데이터 소트" | 데이터 속성별로 정렬, 예를 들어 <td data-sort = "42">. 맞춤형 종류를 수행하는 데 유용합니다. |
| "데이트-미트" | 미국 스타일의 날짜 정렬 MM/DD/YYYY 형식;. EG (12/28/2023). "/"또는 "-"를 분리기로 사용할 수 있습니다. 오버 사이드 "데이트 디트"클래스를 추론합니다. |
| "onload-sort" | 페이지로드시 열을 정렬하십시오. 사용자로부터 클릭을 시뮬레이션합니다. (하나의 열에 대해서만 정렬 할 수 있습니다) |
| "비활성화" | 이 특정 열로 테이블을 분류하지 못하게하십시오. |
| <th> 추론 된 수업. | 설명 |
|---|---|
| "숫자-소트" | 소수성, 음수 (마이너스 및 괄호 표현 모두에서)를 포함한 숫자를 정렬합니다. |
| 공통 통화 지원 예를 들어 ($ £ € ¥), 백분율 표시 (0.39%) | |
| "데이트-마이어 스토프" | DD/MM/YYYY 형식의 날짜 정렬. EG (18/10/1995). "/"또는 "-"를 분리기로 사용할 수 있습니다. |
| "데이트 -MYD-SORT" | ISO 8601 yyyy/mm/dd 형식의 날짜 정렬. EG (2021/10/28). "/"또는 "-"를 분리기로 사용하십시오. |
| "파일 크기-소트" | 정렬 파일 크기 (b-> tib)는 이진 접두사를 사용합니다. (예 : 10 B, 100 kib, 1 mib); 숫자와 접두사 사이의 선택적 공간. |
| "런타임 소트" | 런타임을 몇 시간 및 몇 초로 정렬합니다 (예 : 10h 1m 20s). GitHub 작업 실행 시간 열을 정렬하는 데 유용합니다 ... |
| <th> 기본값을 변경하는 클래스. | 설명 |
|---|---|
| "주문 별" | 첫 번째 클릭으로 내림차순으로 주문하십시오. (기본값은 aescending) |
| "알파 스토프" | 알파벳순으로 정렬 (Z11, Z2); 기본값은 자연스러운 정렬입니다 (Z2, Z11). |
| "구멍 소트" | 문장 부호 정렬; 기본값은 구두점을 무시합니다. |
기여하려면 설치 지침을 여기에서 찾을 수 있습니다.
