AIでウェブ上の特定のデータを抽出する方法｜HTML DOM Query Engine

CSSセレクタを使用して、目的のHTML要素だけをターゲットにします。これにより、ページ内の不要な情報を無視して、必要なテキストや属性のみを正確に取得できます。以下に、この方法がいかに効率的であるかを示します。

1. 01

   ターゲットの特定

   特定のクラスやIDなど、探すべきCSSセレクタをAIに指示します。

   query_dom
2. 02

   クエリの実行

   AIがページのDOMに対してセレクタを実行し、指定されたノードを分離します。

   query_dom
3. 03

   コンテンツのフィルタリング

   周囲のHTMLタグを取り除き、生のテキストまたは属性値のみを残します。

   query_dom
4. 04

   結果の整形

   抽出したデータを、チャット内でそのまま利用できる形式に整理します。

   query_dom

Cheerio DOM Connector

準備完了です。MCPクライアントを選択し、セットアップ手順に従ってください。

コネクタリンクhttps://edge.vinkius.com/vk_preview_yforvmpWi3y9TqnYhrCHzOXtUdI6qMtPsOkV6gLr/mcpコピー

Claude Desktop

以下の手順で数秒で接続できます。

1. 1In Claude Desktop, open Settings → Connectors.
2. 2Click “Add custom connector” and paste the connector link above as the remote MCP server URL.
3. 3Click Add and start a new chat — Cheerio DOM capabilities are ready to use.

設定 · claude_desktop_config.jsonコピー

{
  "mcpServers": {
    "html-dom-query-engine-mcp": {
      "url": "https://edge.vinkius.com/vk_preview_yforvmpWi3y9TqnYhrCHzOXtUdI6qMtPsOkV6gLr/mcp"
    }
  }
}

• Claude
• ChatGPT
• Cursor
• VS Code
• Windsurf
• Claude Code
• JetBrains
• Cline

リンクをクリックして接続してください。認証情報は暗号化され、お好みのAIクライアントからあらゆるサイトに対してクエリを実行できるようになります。

• 01

  AIはボタンをクリックしたり、フォームに入力したりできますか？

  いいえ。このMCPは既存のDOM要素を読み取り、クエリを実行するために設計されており、ウェブページを操作したりナビゲートしたりすることはできません。

• 02

  CSSセレクタが間違っている場合はどうなりますか？

  AIは空の結果を返すか、エラーを表示します。ツールが情報を発見できるように、有効なセレクタを指定する必要があります。

• 03

  AIはウェブページ全体を見ているのですか？

  AIはツールを使用して、リクエストされたページ内の特定の箇所のみを確認します。明示的に指示しない限り、HTMLファイル全体をメモリに取り込むことはありません。

• 04

  ログインが必要なサイトからデータをスクレイピングできますか？

  いいえ。このツールは、AIが現在アクセス可能な状態のDOMに対してクエリを実行します。認証を回避したり、アカウントにログインしたりすることはできません。

• 05

  AIはウェブサイトの内容を変更できますか？

  いいえ。このツールは読み取り専用です。HTMLから情報を抽出することのみが可能で、ウェブ上の情報を変更、削除、またはアップロードすることはできません。

• HTML DOM Query Engine について他に質問がありますか？ HTML DOM Query Engine Connector の全機能を見る