■
フレーム内の要素にアクセスする方法を調べた
Firefoxにおいて動くコードをまず作った
しかしこれがChromeでは動かない・・なぜだろう
Firefoxでフレーム内のリンク数を調べるJavascript
test.html frame1.html frame2.htmlをそれぞれ同じフォルダに作成しtest.htmlをブラウザで開くことで実験できる
<html> <!-- test.html --> <body> <a href="test.html">reload</a> <a href="test.html">reload</a> <a href="test.html">reload</a> <a href="test.html">reload</a> <a href="test.html">reload</a ><a href="test.html">reload</a> <iframe src="frame1.html" width="100%" height="600" frameborder="1" scrolling="yes"></iframe> <iframe src="frame2.html" width="100%" height="600" frameborder="1" scrolling="yes"></iframe> </body> <script> window.addEventListener("load",onLoad,false); function onLoad(e){ var iframes=document.getElementsByTagName("iframe"); window.alert("from test.html "+iframes.length); for(var i=0;i<iframes.length;i++){ var iframe=iframes[i]; window.alert(iframe.contentWindow.document.getElementsByTagName("a").length); } } </script> </html>
<html> <!-- frame1.html --> <body> frame1 <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> </body> </html>
<html> <!-- frame2.html --> <body> frame2 <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> <a href="test.html">link</a> </body> </html>
firefoxではうまくリンク数が表示されたが、Chromeだとうまくいかない。
Chromeのコンソールに
Unsafe JavaScript attempt to access frame with URL file:*/frame1.html from frame with URL file:*/test.html. Domains, protocols and ports must match.
test.html:20Uncaught TypeError: Cannot call method 'getElementsByTagName' of undefined
上の行が下の行のエラーに繋がっているのだろうか?
なにが間違っているんだろうか?
もしかしてバグ??