Softex CelwareTech Blog
バニラJS Webアプリ2026-10-01

変化するChatGPTの回答DOMから本文を安定して取得する

ChatGPTの画面構造変更で回答を取得できなくなった事例から、本文の根を読む、IDを祖先から得る、旧セレクターを段階的に残す調査手法を紹介します。

Chrome拡張機能DOMChatGPTセレクター

画面のDOMを読むChrome拡張は、Webアプリ側のマークアップ変更で突然対象を見失うことがあります。2026年9月30日の調査では、ChatGPTの回答を識別するために使っていた複数の属性や要素が見つからなくなり、ページ自体は開いているのに「回答なし」と判定される状態が確認されました。

最も深い回答本文を読む

調査時点で回答本文の候補として確認できた目印は、次の属性でした。

const answerRoots = document.querySelectorAll(
  '[data-markdown-text-style="assistant-message"]'
);

メッセージのかたまり全体ではなく、本文を包む要素を読むことで、スケジュール名や画面上の補助見出しを回答本文へ混ぜずに済むことがあります。本文を見つけた後、祖先要素からdata-chatgpt-selection-message-idを探してメッセージIDを得ます。それがないケースでは、祖先のdata-chatgpt-search-message-idsに含まれるID一覧の末尾を候補として使う方法が観測されました。

これらは公開APIの契約ではなく、2026年9月30日時点の画面DOM観測です。属性名や構造が変わる可能性があるため、製品コードでは取得時点を明示し、必ず実際の対象画面で再確認してください。

変更を早く見つける調査手順

回答本文にだけ現れる既知の短い目印を使い、その文字列を含む最も深い要素を探します。SCRIPT、STYLE、NOSCRIPT、TEMPLATEや入力欄は除外し、対象要素から祖先へ向かってid、role、data-*、aria-*だけを記録します。本文全体や会話履歴を診断ログへ出さないことで、必要なDOM構造だけを共有できます。

見つからないときは、ページ全体のHTMLを保存する前に、本文候補の件数、属性名、親子関係を確認します。マーカー文字列がscript要素に埋め込まれた場合や、同じ文章が複数箇所に表示される場合も考慮します。

フォールバックを段階化する

DOM更新に備えて旧セレクターを一度に削除せず、新しい候補を優先順位の先頭に追加し、旧候補を後段のフォールバックとして残します。取得結果が複数ある場合は、著者種別、本文の空でなさ、祖先のターン識別子など複数条件で絞り込みます。仮のキーや画面表示用の連番はページを開き直すと変わる可能性があるため、永続IDとして扱わないようにします。

まとめ

Web画面のDOM取得では、広いコンテナのテキスト全体ではなく、意味のある本文要素を特定し、属性や祖先構造を小さく調べることが重要です。セレクターは観測時点の実装依存として扱い、複数の候補、結果検証、プライバシーに配慮した診断を組み合わせましょう。

関連記事

この技術で業務改善しませんか?

Excel VBA・GAS・Webアプリで業務の自動化ツールを開発しています。 「こんなことできる?」というご相談だけでもお気軽にどうぞ。

無料相談はこちら →