多くのWebサイトはページネーションを使って、コンテンツをロードします。たとえば、ECサイトの商品リストは、1枚ページではなく、複数のページに分かれて置かれています。ですから、複数のページからデータを抽出するには、ページネーションの移動を設定しなければなりません。

このチュートリアルでは、2つのページネーションのケースについて説明します。

1) 「次へ」ボタンがある場合

2) 「次へ」ボタンがない場合

 

 

 

(タスクの作りを続くには、 リストの内容を抽出する方法  と 各アイテムのページからデータを抽出する方法 をご参照ください。)

 

ヒント！ ページ単位のコンテンツがAJAXを介して読み込まれる場合は、「次のページをクリックする」ステップに2〜4秒のAJAXタイムアウトを設定します。AJAXつ使っていない場合は、AJAXタイムアウトを設定しないでください。 AJAXの詳細を見る

 

 

 

ヒント！ ループでページ番号 「1」を選択したため、自動生成したページネーションループは正しく機能しません。現在の設定では、Octoparseは次のページに移動しようとすると「1」をクリックし続け、重複したデータが無限に抽出されます。

 

ですから、このタイプのページネーションを扱う際の重要な部分は、「次のページをクリックする」のXPathを変更することです。

ここでよく使われるXPath構文は、カレントノードの後ろにあるすべての兄弟を選択する「following-sibling」です。

たとえば、1番目ページにいるときは、ページ番号「2」をクリックしてページ2に、次にページ3に移動します。

 

1) これを行うには、まず選択したページ番号のXPathを見つける

ソースコードを調べて、選択したページ番号のコードを探します（ページ番号「1」を右クリックし、「Inspect Source Code」などのコマンドを選択することによって見つけます）。下の例では、ページ1のノードコードは<td class="graytext" align="right">下の[b]タグです。

ですから、そのXPathは次のようになります。

.//*[@id='cs2-pagebrowserbottom']/div/div[2]/table/tbody/tr/td[3]/b

 

 

2) XPath構文「following-sibling」を使って2番目のページのノードを選択する

ノードコード「b」の後ろ最初の「a」タグ内に2番目のページがあるので、正しいXPathは次のようになります。

.//*[@id='cs2-pagebrowserbottom']/div/div[2]/table/tbody/tr/td[3]/b/following-sibling::a[1]

 

 

3) 「ページネーション」ループに自動生成XPathを新しいXPathに置き換える

• 「ページネーション」ループをクリックして、右側の「単一要素」に新しいXPathを入力します。

 

 

5) XPathをもう一度チェックして、他のページでも動作することを確認してください。

•  ページネーションループをクリックします。
• 「次のページをクリックする」アクションをクリックします。
• Webページが次のページに移動したかどうかを確認します。
• より多くのページに上記の手順を繰り返します。

 

 

 

 

ヒント！ XPathは、Webページ上の特定の要素を見つけるために使用されますが、Webページのソースコードに基づいています。ですから、この例で書いたXPathは他のWebサイトに適用されませんが、XPathの書く方法を常に適用できます。

 

 

関連記事:

XPathで要素を見つける  

無限スクロールでの読み込み  

AJAXを扱う方法