🌊

2. 万博自動化検証 ― JavaScript の特徴と自動化に向く理由

に公開
AI
JavaScript
自動化
万博
idea

2. 万博自動化検証 ― JavaScript の特徴と自動化に向く理由

📌 前回の記事：1. 万博自動化検証 ― はじめに（Python,JavaScript）

ブラウザ上で直接動作できる

JavaScript の大きな特徴の一つは、ブラウザ環境で直接動作する言語であることです。
追加の環境構築をせずに「いま目の前で開いているページ」にそのまま適用できるため、学習目的の小規模な自動化には非常に向いています。

Python であれば selenium を用いてブラウザを制御する必要がありますが、JavaScript なら拡張機能（例: Tampermonkey）にスクリプトを登録するだけで即座に動かせます。

DOM へのアクセスと操作

JavaScript は DOM（Document Object Model） に直接アクセスでき、ページ内の要素を自由に取得・変更できます。
これにより、次のような処理が可能になります。

  • ボタンの有効／無効状態を監視する
  • 特定のテキストが表示されたかどうかを確認する
  • 必要に応じてクリックや入力操作を自動で行う

ブラウザ上でユーザーが行う操作を「プログラムでそのまま再現」できるのが大きな強みです。

setInterval と MutationObserver

自動化でよく使うのが 定期チェックとDOM変化の監視です。

  • setInterval
    指定した間隔で繰り返し処理を実行できる。
    → 例えば「ボタンが有効になったか」を数百ミリ秒ごとに確認するのに適する。

  • MutationObserver
    DOM の変化をフックできる。
    → ページに新しい要素が追加された瞬間や属性が変化した瞬間に処理を走らせられる。

これらを組み合わせることで、「時間経過による監視」と「構造変化の監視」の両方を実現できます。

Chrome 開発者ツールでのデバッグ

さらに Chrome には強力な 開発者ツールが用意されています。

  • Elements タブで DOM 構造をリアルタイムに確認
  • Console タブで console.log 出力を追跡
  • Network タブで通信の状態を確認

これらを利用すれば、自動化スクリプトが なぜ動かないのか／どの要素を参照しているのか を即座に検証できます。

学習中でも試行錯誤しやすく、自動化処理の理解が深まりました。

免責事項

本記事は Web 自動化の学習記録をまとめたものであり、Expo 2025 チケット予約システムの不正利用を助長する意図は一切ありません。
実際にスクリプトを利用する場合は、万博公式の規定や利用規約に従うことが必須です。
本記事を参考にしたことによって生じたいかなる不利益・損害についても、筆者は責任を負いません。

Discussion