Web 要素の座標とサイズを取得する

  • [アーティクル]

Web アプリケーションと Web ページを自動化する場合、特定の要素の正確な場所とサイズを知ることが必要な場合があります。

この情報を取得するには、ブラウザー インスタンスを作成し、Web ページ上の要素の詳細を取得アクションをデプロイします。 アクションのプロパティで、属性名オプションを waelementrectangle に設定します。 このアクションは、取得した値を AttributeValue という名前のテキスト変数に格納します。

Note

Web ページ上の要素の詳細の取得アクションには、選択した属性を取得する Web 要素を指定する UI 要素が必要です。 UI 要素の詳細については、UI 要素を使用して自動化する を参照してください。

Web ページの要素の詳細を取得するアクションのスクリーンショット。

AttributeValue テキスト値を取得した後、それを個別の値に分割し、数値に変換する必要があります。

テキスト値を分割するには、テキストの分割アクションをデプロイし、コンマ文字 (,) を区切り記号としてを使用して値を区切ります。 分離された値は、TextList という名前のリスト変数に格納されます。

[テキストの分割] アクションのスクリーンショット。

テキストを数値に変換する前に、新しいリストの作成アクションを使用して、次の手順で、変換された数値を格納するリストを作成します。

TextList の各項目に個別にアクセスするには、For each ループを展開します。

For each ループのスクリーンショット。

ループ内で、テキストを数値に変換アクションを使用して、ループの現在のテキスト項目を数値に変換します。

テキストを数値に変換アクションのスクリーンショット。

次に、項目をリストに追加アクションを使用して、生成された数値を以前作成されたリストに保存します。

[項目をリストに追加] アクションのスクリーンショット。

フローの後半で最終の座標とサイズの値にアクセスするには、次の表記を使用します。

  • List[0] - HTML ページの左上隅を基準にした Web 要素の左側の点
  • List[1] - HTML ページの左上隅を基準にした Web 要素の上側の点
  • List[2] - 要素の幅
  • List[3] - Web 要素の高さ

ウィンドウの右と下の点を計算するには、次の式を使用できます。

  • %List[0] + List[2]% - Web 要素の右側の点
  • %List[1] + List[3]% - Web 要素の下側の点

Note

リストと VariableNameItemNumber[ItemNumber] 表記の詳細については、変数のデータ型 を参照してください。

HTML ページの左上隅の座標を見つけるために、Web ブラウザーのインスタンス プロパティ DisplayRectangleX および DisplayRectangleY を使用できます。

ブラウザーのインスタンスを %Browser% という名前の変数に格納した後、%Browser.DisplayRectangleX% 式と %Browser.DisplayRectangleY% 式を使用して X と Y の寸法を取得します。

[変数の設定] アクションの ％Browser.DisplayRectangleY ％式のスクリーンショット。

さらに、Web ページ上の要素の詳細の取得アクションの waelementcentercoords 属性を使用して、Web 要素の中心を指定する座標を取得できます。