HTML 표 to JSON/CSV 변환기

이 도구는 무엇인가요?

웹페이지는 종종 가격 페이지, 통계 페이지, 스크래핑한 목록처럼 데이터를 HTML <table> 요소 안에 담아 보여주지만, 이 마크업은 코드나 스프레드시트에서 바로 쓸 수 있는 형태가 아닙니다. 이 도구는 붙여넣은 <table> 마크업을 파싱해 헤더 행을 읽고(<thead>/<th>가 있으면 그것을, 없으면 첫 번째 <tr>을 사용) 이후 각 행의 셀을 헤더에 매핑해 JSON 객체 배열이나 CSV 파일을 만들어냅니다.

반대 방향도 지원합니다: JSON 객체 배열이나 CSV 텍스트를 붙여넣으면, 열 헤더를 담은 <thead>와 데이터 행을 담은 <tbody>를 갖춘 제대로 된 HTML 표를 생성해 웹페이지나 CMS에 바로 붙여넣을 수 있게 해줍니다.

모든 처리는 브라우저 내장 DOMParser로 이루어집니다 — HTML이 서버로 전송되지 않으므로 내부 자료나 민감한 데이터가 포함된 내용을 붙여넣어도 안전합니다.

출처: 표 구조는 WHATWG HTML Living Standard의 table 요소 정의를 따릅니다.

왜 사용해야 할까요?

• 양방향 변환 — HTML 표를 JSON으로, HTML 표를 CSV로, 그리고 JSON/CSV를 다시 깔끔한 HTML 표 마크업으로.
• 자동 헤더 감지 — <thead>/<th> 마크업이나 헤더 행으로 쓰인 일반 첫 번째 <tr> 모두 작동합니다.
• 스프레드시트에 먼저 붙여넣을 필요 없이 표 마크업에서 곧바로 구조화된 데이터로 이동합니다.
• 제대로 이스케이프된 HTML을 생성하므로 데이터 안의 <나 & 같은 특수문자가 표를 망가뜨리지 않습니다.
• 100% 클라이언트 처리 — 내부 페이지나 관리자 패널에서 가져온 HTML이 브라우저를 벗어나지 않습니다.

사용 방법

1. HTML 표를 변환하려면: 첫 번째 박스에 <table>...</table> 마크업을 붙여넣고 "Convert to JSON" 또는 "Convert to CSV"를 클릭하세요.
2. 결과를 확인한 뒤 복사하거나 다운로드 링크를 클릭해 파일로 저장하세요.
3. HTML 표를 생성하려면: 두 번째 박스에 JSON 배열이나 CSV 텍스트를 붙여넣으세요.
4. "Convert to HTML table"을 클릭하고 생성된 마크업을 페이지나 CMS에 복사해 넣으세요.

예시

입력

<table><tr><th>name</th><th>age</th></tr><tr><td>Alice</td><td>30</td></tr></table>

결과

[{"name":"Alice","age":"30"}]

첫 번째 행의 셀이 객체의 키가 되고, 이후 각 행은 텍스트 값을 가진 하나의 배열 요소가 됩니다.

실용 팁

• 웹페이지의 표에서 데이터를 추출할 때: 페이지 소스 보기나 요소 검사로 <table>...</table> 마크업을 복사해 데이터를 일일이 다시 입력하는 대신 여기에 붙여넣으세요.
• API 응답을 사이트나 CMS에서 읽기 쉬운 표로 게시할 때: JSON 배열을 두 번째 박스에 붙여넣고 생성된 HTML을 페이지의 서식 있는 텍스트나 HTML 블록에 바로 복사하세요.
• 표가 <div>나 CSS 그리드 레이아웃으로 만들어져 있고 실제 <table> 마크업이 아니라면 이 도구로 파싱할 수 없습니다 — 원본 페이지가 실제 HTML 표 태그를 사용해야 합니다.

헤더 감지가 중요한 이유

명확한 헤더 행이 없는 표는 모호합니다 — 나머지 행을 구조화된 레코드로 바꾸려면 어떤 행이 열 이름을 정의하는지 먼저 알아야 합니다. 이 도구는 브라우저와 대부분의 스크래퍼가 하는 방식대로 이 모호함을 해결합니다: 먼저 명시적인 <thead> 섹션을 찾고, <thead>가 없을 때만 첫 번째로 보이는 행을 헤더로 취급합니다. 덕분에 더 의미론적인 태그를 생략한 손으로 작성했거나 스크래핑한 표 마크업에서도 변환 결과가 예측 가능하게 유지됩니다.

자주 묻는 질문