TypeScript:
HTMLの解析

方法:

始めるには、node-html-parserのようなライブラリをインストールします。こちらがターミナルコマンドです:

npm install node-html-parser

それでは、TypeScriptで基本的なHTMLを解析してみましょう:

import { parse } from 'node-html-parser';

const html = `<ul class="fruits">
                <li>Apple</li>
                <li>Banana</li>
              </ul>`;

const root = parse(html);
console.log(root.querySelector('.fruits').textContent);  // "Apple Banana"

そして、バナナだけを取得したい場合は:

const bananas = root.querySelectorAll('li')[1].textContent;
console.log(bananas);  // "Banana"

深掘り

HTMLの解析は新しいものではありません。それはウェブの初期の日々からありました。最初は開発者が正規表現を使用していたかもしれませんが、それはすぐに混乱しました。DOMパーサーの出現:安定していますが、ブラウザに縛られています。

node-html-parserのようなライブラリは苦痛を抽象化します。これらは、jQueryで行うようにHTMLをクエリすることを可能にしますが、Node.jsでサーバーサイドで行います。それは速く、不適切なHTMLに対して寛容で、DOMに優しいです。

jsdomもあります。これは完全なブラウザ環境をシミュレートします。それはより重いですが、より徹底的で、操作と相互作用のための完全なドキュメントオブジェクトモデル(DOM)を作成します。

Cheerioを忘れてはなりません。それは、速度と小さなフットプリントとjQueryのような構文を融合させ、二つの間に幸せに位置しています。

参照

もっと知りたい場合は、これらに飛び込んでみてください: