• 締切済み

Firefox にて appendChild での iframe のリロードを止めたい

JavaScript で、自身の HTML コンテンツをいじっています。 HTML コンテンツの中に iframe 要素を子孫に持つノードが有り (iframe 要素そのものでも可)、これを HTML オブジェクトツリーの別位置に移そうと removeChild, appendChild をすると、Firefox の場合、その iframe 要素の src 属性をリロードしてしまいます。 これを、リロードせずに移す方法はないでしょうか? Firefox 特有の操作でもかまいません。お願いいたします。

みんなの回答

回答No.3

iframeで読み込むHTMLドキュメントに Last-ModifiedとExpiresヘッダを付けてキャッシュを読ませるようにするのはどうでしょうか。 HTTPヘッダの追加が出来なければ<meta>で代用できるかもしれません。

beubeu
質問者

お礼

フォローありがとうございます。 キャッシュもやってみたのですが、HTTP 通信レベルでの request, response は無くなるのですが、iframe に突っ込んだ側で onload がコールされてしまいます。

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

#1です。 なかなか手ごわいですねぇ。 思いつきだけなので、参考になるかどうか… □cloneを作成して先にappend、後からremove。  (画像と違うのでリロードしちゃうかも) □移動する位置が決まっているなら  最初から目的の位置にもiframeを作成して、表示/非表示で切り替える □iframeを移動させずに、残りの要素を移動して同じレイアウトにする  (かなり強引かも) □表示レイアウトでの変更が目的なら  要素を移動するのではなく、CSSで対応する方法がないか検討する ぐらいしか、思いつきません。 後は、他の方のお知恵にすがることにします。

beubeu
質問者

お礼

フォローありがとうございます。 cloneNode をやっても同様です。 で、これは表示位置を移動したいのではなく、あくまでも HTML の DOM ツリーの位置を移動したいのです。

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

Firefoxが手元にないので確認できませんが、 一旦removeすると無いものとみなされて、新たに追加したときに読みにいくのではないかと推測しました。 要素をremoveしないで、直接appendすることでも移動できると思いますが、それではうまくいかないでしょうか?

beubeu
質問者

お礼

removeChild せずに appendChild をコールした場合、元の位置から自動的に消えて、新しい位置に移りますが、やはりリロードが発生します。replaceChild や insertBefore も同じです。

関連するQ&A

  • iframe内をリロードできますか?

    たとえば <HTML> <head> <script language="javascript"> <!-- function a1reload(){ "iframe内をリロードする文章" } //--> </script> </head> <body> <iframe src="a1.html" id="a1iframe"><br> <a href="javascript: a1reload()">ここをクリック</a> </body> </HTML> こんな感じでiframe内をリロードできないでしょうか? お願いします。

  • iframeのサイズを自動設定する方法はあります

    iframeをJavascriptで生成後、srcで指定されたHTMLコンテンツの高さに 自動的にiframeのheightを設定したいのですが可能でしょうか? var iframe = document.createElement('IFRAME'); iframe.setAttribute('src', 'http://net-bike.ne.jp'); iframe.setAttribute('width','100'); iframe.setAttribute('height','100'); currentScript.parentNode.insertBefore(iframe, currentScript.nextSibling);

  • javascriptを無効にする方法~<iframe>タグが正常に動作しない~

    下記、HTMLを作成したのですが、wikipediaのjavascript?によって、折角開いた、yahooのページもwikipediaにとって変わられてしまいます。 wikipediaのjavascriptを無効にする方法は無いでしょうか?若しくは、こういったjavascriptを見つけた時、強制的に、排除する方法など無いでしょうかね? 折角開いたページが、こういったjavascriptがあることで全て強制的に飛ばされてとても困っています。 宜しくお願い致します。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <IFRAME src="http://ja.wikipedia.org/" width="900" height="1500"></IFRAME> <HR> <IFRAME src="http://yahoo.co.jp" width="900" height="1500"></IFRAME> </BODY> </HTML>

  • JavascriptでDIV~DIVをリロードで

    はじめまして質問いたします。 JavaScriptにて<div id="test">~</div>の間をリロード毎に変更させたいのです。 <div id="test"> <h2>リーロード毎に変更</h2> <div id="contents"> <img src="../images/test.jpg"> <p>テスト要素です</p> </div> </div> 上記の<div id="test">~</div>の中身をページを開いたり、リロードする度に変更させたいのですが、 Javascriptを使用して自動でできるようにしたいのですが、どうかご教授ください。 よろしくお願いします。

  • FireFoxにプロパティ"src"は存在しない?

    指定された画像要素の"SRC"属性を書き換えて、 以下のような画像を変更するプログラムを書いています。 function hoge(ImgName){ document.getElementById("Picture").src=ImgName; } (中略) <img src="" id="Picture" onClick="JavaScript:hoge(hoge.jpg)"> IEでは実行可能なのですが、FireFoxで実行すると 「document.getElementById("Picture") has no properties」 というエラーが出てしまいます。 setAttributeなども試したのですが同様のエラーが出てだめでした。 やはり指定プロパティ(src)が存在しないので駄目みたいです。 FireFox等でIMG要素のSRC属性を書き換えるにはどうすれば 良いでしょうか。アドバイスをお願いします。

  • JavaScript 配列とiframe

    カテゴリを誤って投稿してしまいました。 インラインフレームを二つ(iframe1,iframe2)用意し、jQueryにてクリック出来るようにしたdiv要素のクリックで、それぞれのリンク先をJavaScriptの配列に収めた連番通り、1,2,3,4…htmlと表示させたいのですが、二つの配列を使用すると連番通りに表示されなくなります。(一つの配列使用では連番通りに表示されます。) 1クリックで、iframe1にはiframe1link1.htmlの表示、iframe2にはiframe2link1.htmlの表示。クリックごとにlink2,link3と順番どおりに表示する、これを可能にするお知恵を拝借したいと思い投稿させて頂きます。よろしくお願いいたします。 ================ (JavaScript(1)iframe1.js) var URLs=new Array(); var cnt=0; URLs[1]="iframe1link1.html"; ******* URLs[10]="iframe1link10.html"; function Jump1(){ cnt++; if(cnt==11) {cnt=0;} iframe1.location.href=URLs[cnt]; } ================= (JavaScript(2)iframe2.js) var URLs=new Array(); var cnt=0; URLs[1]="iframe2link1.html"; ******* URLs[10]="iframe2link10.html"; function Jump2(){ cnt++; if(cnt==11) {cnt=0;} iframe2.location.href=URLs[cnt]; } ================ (HTML) <!doctype html> <link rel="stylesheet" href="./css/style.css" type="text/css"> <script src="iframe1.js"></script> <script src="iframe2.js"></script> <title>sample</title> <div id="container" class="div" onclick="Jump1();Jump2()"> <div id="main"> <iframe src="./iframe1link0.html" id="iframe1"></iframe> <iframe src="./iframe2link0.html" id="iframe2"></iframe> </div> </div> これでは連番通りにいかない。 ====================

  • 属性の削除について

    属性の削除を行いたいのですが、親オブジェクトの記述が解りません。 詳しい方教えてください。 <script type="text/javascript"> <!-- 親オブジェクト = document.getElementByID("ID名"); 削除するオブジェクト = document.getElementByID("ID名"); 親オブジェクト.removeChild(削除するオブジェクト); // --> </script> HTML <div class="image"> <a href="○○○.gif" title="" rel="△△"><img src="○○○.gif"></a> </div>

  • appendChildをしても表示されない

    javascriptでどうしてもわからなかったので質問させて下さい。 'http://weather.livedoor.com/plugin/common/forecast/13.js'というスクリプトを読み込んで表示させたいのですが、IEでは表示されません。firefoxでは正常に表示されます。 IEでも表示する方法はあるのでしょうか。何が悪いのでしょうか。教えてください。 以下のページで作成しています。 http://www.ajaxblogparts.com/blogparts/simple.html   <body> <script type="text/javascript"> url = 'http://weather.livedoor.com/plugin/common/forecast/13.js'; var script = document.createElement('script'); script.type = 'text/javascript'; script.charset = 'euc-jp'; script.src = url; document.body.appendChild(script); </script> </body>

  • googleモバイルがiframeで表示できない

    firefox3.6.20で以下のHTMLを表示した際、画面が真っ白になります。 <html><head></head> <body> <iframe id="myframe" src="http://www.google.co.jp/m"/> </body> </html> iframeの表示URLをhttp://www.google.co.jp/にした際は正しく表示されます。 googleモバイルだけ表示されないのはなぜでしょうか。

    • ベストアンサー
    • HTML
  • 呼び出されたページを閉じ、呼び出し元をリロードしたい。

    教えて下さい。 asp(htmlを生成)とjavascriptを利用して下記事項の実現は可能でしょうか? 呼び出し元ページからウィンドウをwindow.openで開く window.openで開かれたページに閉じるボタンを設置 そのボタンを押すと、window.openで開かれたページを閉じ、 呼び出し元ページのiframe内のコンテンツをリロードする。 参考になるサイト・ヒントなんでも結構ですので、 どうかご教授お願いします。

専門家に質問してみよう