Web Artisan Blog - ウェブ アルチザン ブログ

JS:iframeの内容を取得する方法

JavaScript・XHTML・CSS (43 items)

2006年04月03日

JavaScriptでiframeの内容（中身、src属性で指定したURLの内容）を取得するには・・。

まず、以下のサンプルをご覧ください。
onload時に、iframe内のアンカータグのhref属性の値をalert表示します。（ついでに別ウィンドウでリンク先へ遷移します）
＞サンプル

ソースは以下の通り。


・iframetest.html
<?xml version="1.0" encoding="EUC-JP"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<title>iframe test</title>
</head>
<body>
<iframe src="iframe.html" height="150" width="600">
この部分は iframe 対応のブラウザで見てください。
</iframe>
<script type="text/javascript">
<!--
window.onload = function() { 
  var myiframe; 
  var iframe;
  myiframe = document.getElementsByTagName('iframe'); 
  for (var i = 0; i < myiframe.length; i++) { 
    if (myiframe[i].contentDocument) {
      iframe=myiframe[i].contentDocument;
    } else {
      iframe=myiframe[i].Document;
    }
    if (iframe.addEventListener) {
      iframe.addEventListener('click',func_test, true) 
    } else {
      iframe.attachEvent('onclick',func_test) 
    }
  } 
}
function func_test(e) { 
  var url;
  if (document.all) {
      url = e.srcElement.href;
  } else if (document.getElementById) {
      url = e.target.href;
  }
  alert(url);
}
-->
</script>
</body>
</html>

・iframe.html
<html>
<head>
<title>iframe test</title>  
</head>
<body>
<a href="http://www.res-system.com/weblog/" target="_blank">Web Artisan Blog</a>
</body>
</html>
iframetest.html内のJavaScriptでは、getElementsByTagNameで画面内のiframeオブジェクトを取得、更にcontentDocument、またはDocumentにてiframeの内容を取得し、clickイベントにfunc_test関数をaddEventListener（attachEvent）、func_test関数内でalert表示しています。

ここで注意点、
こういう場合は、iframeのsrc属性の指定先のドメインと、サンプル画面のドメインが同じでないといけません。src属性先が外部ドメインであると、セキュリティエラーとなります。。
もし、仮にこれが外部ドメインでできれば、例えばGoogleAdSenseの広告リンク先を確実に知れる、・・もっというと、AdSenseタグの内容を摺りかえることができるかも知れません。ヤバイ。。
でも、このエラーはIEであれば6以上で出る、言い換えれば5.5以下であればエラーとならないので、、、コワイデス。

前の記事 次の記事

Comments

コメントは、まだ書かれていません

Add Comments

Trackback

Forget It Not wrote:

ブラウザに先読み機能を付けてみる:
いろいろと調べ物をするときにWikipediaが役に立つけど どうもページの読み込みが遅い。 タブブラウザだとあらかじめタブを開いておくという手もあるけど、 これだと全部のタブを一度に読み込みにいくようで、 効率が悪い気がしていけない。 それならJavaScriptでなんとか..
2006年04月12日 19時55分20秒

Trackback URL

http://www.res-system.com/weblog/action.php?action=plugin&name=TrackBack&tb_id=571