Presented by Nishishi via Movable Type. Last Updated: 2016/10/14. 13:32:50.

ページ内のリンク数を調べる

HTML内に存在するすべてのリンクは、document.linksで得ることができます。ページ内に存在するすべてのリンクが配列として得られるので、この長さ(length)を見れば、ページ内に存在するリンクの個数が分かります。

JavaScriptソースは以下のような感じ。

ver linknum = document.links.length;

これで変数linknumに、ページ内のリンク総数が入ります。
ダイアログに表示したければ、以下のように記述すると良いでしょう。

alert( document.links.length );

これを表示すると、以下のように見えます。

JavaScriptを含めたHTMLソースは以下の通り。

<input type="button" value="このページ内のリンク総数を表示" onclick="alert( document.links.length );" />

個数を表示するのではなく、すべてのリンク1つ1つを対象に何らかの処理をしたい場合は、for文と合わせて以下のようにすると良いでしょう。

function GetAllLinks() {
   var LinkNum = document.links.length;
   var Counter;
   for( Counter=0 ; Counter < LinkNum ; Counter++ ) {
      alert( Counter +" : "+ document.links[Counter] );
   }
}

これを表示させてみると、以下の通り。

(クリックするとリンクの数だけアラートボックスが表示されるので注意。リンク数が多いとなかなか終わりません。)

このように、document.links[添字]で、各リンクにアクセスできます。添字は0から始まります。document.links.lengthの値がもし「10」だったとすれば、0~9までループさせればすべてのリンクが得られます。

使い方次第で、なかなか面白いスクリプトが作れそうですね。

JavaScript TIPS 主要なカテゴリ

現在、以下のカテゴリに区分してTIPSを公開しています。

  • イベント : JavaScriptを実行するトリガーとなるイベントに関するTIPS
  • 入力フォーム : JavaScriptで入力フォームを扱う方法に関するTIPS
  • 情報取得 : JavaScriptで様々な情報を得る方法に関するTIPS
  • 操作・移動 : JavaScriptでブラウザを操作したり表示ページを移動したりする方法に関するTIPS
  • 日付・時刻 : JavaScriptで日付や時刻を扱う方法に関するTIPS
  • 機能 : JavaScriptで何らかの機能を実現する方法に関するTIPS
  • 装飾・内容変更 : JavaScriptで装飾や内容を変更する方法に関するTIPS
  • 計算・変換 : JavaScriptで様々な計算や変換処理を行う方法に関するTIPS

▲各カテゴリ毎に、TIPSのタイトルと概要を一覧できます。ぜひ、いろいろ覗いてみて下さい!

関連書籍・関連ソフトなど