iframeのappendChild時再読み込みさせない方法

###前提・実現したいこと
実現したいこと>
広告などのiframeを別のノードへ移動させて、もとの広告のままにしたい
前提>
・Chrome拡張機能での利用を想定
・個別のページではなく任意のページですべて対応したい

###発生している問題・エラーメッセージ
iframe の内容がリロードされてしまう

広告などを表示しているiframeノード（もしくは、iframeを子要素・孫要素としてもつノード）を別のノードへ移動させて、もとの広告の表示のままにしたいのです。しかし、すでにiframe読み込み済みの場合、ノードを移動するとすべてリロードされて別の表示になってしまいます。

回避する方法はありますでしょうか。

それともこれが仕様で避けられない問題でしょうか・・・。

行動規範の内容に同意します

回答1件

ベストアンサー

書き換え時のリロードは止めることはできませんが、「別のノードに移動」は擬似的に可能だと思います。

元の広告位置（座標）から目的ノードの座標に位置をずらしてしまえば、「別のノードに移動」と同じことになると思います。具体的なページの情報が無いのでpositionで動かすのが良いかtransform: translate(10px, 10px)などと動かすのが良いかはちょっと判断できません。

【JavaScript で DOM 要素の絶対座標を取得する方法 | phiary】
http://phiary.me/javascript-get-bounding-client-rect-absolute-position/

投稿2016/06/27 13:03

kei344

総合スコア69407

kanimaru

2016/06/27 22:01

kei344様　ご回答ありがとうございます。やはり書き換えを止めることはできないのですね。　やりたかったことは、Chrome拡張機能をとあるキーワードが合致した任意のページに画面上部もしくは、下部コンテンツを挿入するということなのです。その場合コンテンツによってはposition:absoluteが設定してあり挿入コンテンツが見えない、もしくはもともとあるコンテンツの上に挿入コンテンツを配置してしまうという問題が発生しました。そのため、body以下をdivでラップし、divでposition:relativeを設定。当該divにマージンを取ることで解決したのですが・・・。その際に、iframeの再読み込みという質問の事象が発生しました。　ご回答ありがとうございました。