🌐

TypeScript+NodeJSで手軽にDOMの中身を取り出す

2022/12/25に公開

何かしらの要望でHTMLのテキストコンテンツをパースして取り出したいことがあると思います。
ブラウザ上で動作するJavaScriptであれば Document.querySelector() APIがありますが素のNodeJSには存在しません。
その時jsdomを使うと簡単に実現できました。
使い始めるまでに手間取ったのでそのメモ書きです。

ライブラリの追加

yarn add jsdom
yarn add -D @types/jsdom

実装

import { JSDOM } from 'jsdom';

async function main() {
    const url = "https://example.com/";

    const dom = await JSDOM.fromURL(url);
    const document = dom.window.document;

    console.log({
        text: document.getElementsByTagName('h1').item(0)?.textContent,
    });
}

main();

サンプル中では JSOM.fromURL() でdomを受け取っていますが他にもファイルを渡す JSOM.fromFile() とHTML文字列を渡す JSOM.fragment() があります。

以上です。ブラウザ上以外でquerySelectorを使おうとしたのが初めてだったため思いの外手間取りました。未来の自分かどなたかの役にたてば幸いです。

Discussion