목차 생성기
마크다운 또는 HTML을 붙여넣고 실제 GitHub 스타일의 충돌 방지 앵커 슬러그와 제목 ID가 삽입된 원본 콘텐츠가 포함된 중첩되고 클릭 가능한 목차를 가져옵니다.
결과
목차는 그 아래에 있는 앵커 링크만큼만 유용하며, 앵커 링크는 모든 제목에 고유하고 예측 가능한 슬러그가 있는 경우에만 신뢰할 수 있습니다. 이 생성기는 사용자가 붙여넣은 모든 것(Markdown 또는 HTML)에서 제목을 구문 분석하고 각 제목에 실제 GitHub 스타일 앵커를 할당합니다. 즉, 소문자 텍스트, 공백 및 문장 부호가 대체되거나 제거되고, 중요한 것은 두 제목이 동일한 슬러그를 생성할 때마다 실제 충돌 방지 접미사입니다. 문서의 두 번째 "소개"는 소개-1이 되고, 세 번째는 소개-2가 되며, GitHub의 자체 슬러거가 작동하는 것과 똑같은 방식으로 실행 중인 발생 맵으로 추적됩니다. 제목이 반복될 때 이전 링크를 자동으로 덮어쓰는 바로가기가 아닙니다. 이는 손으로 굴린 목차 스크립트가 중단되는 가장 일반적인 방법입니다.
마크다운 구문 분석은 의도적으로 라인 기반입니다. 왜냐하면 순진한 구현의 전형적인 실패 모드는 울타리 코드 블록 내부에 작성된 "#"을 제목으로 처리하기 때문입니다. 이 도구는 문서를 한 줄씩 탐색하면서 ``` 또는 ~~ 펜스가 현재 열려 있는지 추적하고 열린 펜스 외부의 ATX 제목(#부터 ######까지)만 인식합니다. 따라서 쉘 주석이나 Python "# 주석"을 표시하는 코드 샘플은 목차를 오염시키지 않습니다. HTML 입력은 다른 실제 경로를 사용합니다. 브라우저 자체 DOMParser로 구문 분석되고, 제목은 태그 이름으로 선택되며, 문서가 다시 문자열로 직렬화되기 전에 각 항목의 id 속성이 실제 요소에 직접 설정됩니다.
반대쪽 끝에서 두 가지가 나옵니다. 먼저, 목차 자체는 중첩된 마크다운 목록(- [제목](#slug), 제목 수준으로 들여쓰기)과 중첩된 HTML 목록(<ul><li><a href="#slug">)으로 각각 자체 복사 버튼이 있습니다. 둘째, 앵커가 실제로 연결된 원본 콘텐츠: Markdown 입력의 경우 kramdown, Pandoc, MkDocs 및 GitHub Pages의 Jekyll에서 사용되는 널리 지원되는 {#slug} 제목 속성 구문을 선택하거나, 대상 렌더러가 속성 구문을 이해하지 못하는 경우 이미 id="slug"가 설정된 일반 HTML 제목 태그로 대체할 수 있습니다. HTML 입력의 경우 ID는 구문 분석된 제목 요소에 직접 삽입됩니다. 태그가 이미 존재하기 때문에 선택할 별도의 "모드"가 없습니다.
모든 것이 브라우저에서 로컬로 실행됩니다. 구문 분석, 슬러그 수학 및 문서 재조립은 모두 지금 보고 있는 페이지의 JavaScript에서 발생하며 어디에도 아무것도 업로드되지 않습니다. 이는 초안 문서, 내부 위키 또는 작업 목차를 얻기 위해 타사 서비스에 붙여넣을 준비가 되지 않은 게시되지 않은 블로그 게시물의 경우 중요합니다.