HTMLをMarkdownに変換する理由と使い方
WebページのHTMLをMarkdownに変換したい場面は多くあります。ブログ記事の移行、ドキュメントのコピー、CMS間のコンテンツ移植など。このツールはブラウザ内で完結するHTML→Markdown変換を提供します。
MarkdownとHTMLの対応関係
MarkdownはHTMLを人間が読みやすい記法で書くための軽量マークアップ言語です。`<h1>`は`# 見出し`、`<strong>`は`**太字**`、`<a href="url">テキスト`は`[テキスト](url)`に対応します。GitHubやZennなどのプラットフォームはGFM(GitHub Flavored Markdown)を採用しており、テーブル記法も追加されています。
GFMテーブルの変換
HTML の `<table>` タグは GFM のパイプ記法テーブルに変換されます。`| ヘッダー1 | ヘッダー2 |` の形式でヘッダー行、`| --- | --- |` でセパレータ行、その後に各データ行が続きます。ヘッダーセルが `<th>` でなく `<td>` の場合でも最初の行はヘッダーとして扱います。
コードブロックの変換
`<pre><code>` は ``` で囲まれたコードフェンスに変換されます。`<code class="language-javascript">` のようにクラスに言語名が含まれている場合は、そのままフェンスの言語ヒント(` ```javascript `)として出力されます。インラインの `<code>` はバッククォートで囲まれたインラインコードになります。
ネストしたリストの扱い
`<ul>` と `<ol>` のネストは、インデント(2スペース)で表現されます。` - 親項目` の下に ` - 子項目` が続く形式です。`<li>` の中にさらに `<ul>` や `<ol>` がある場合も正しく再帰的に変換されます。