ひ孫に当たるiframe から親ウインドウにあるiframeの背景色を変えたい．

HTML構成を示します．
親 index0.html（name:content0)
　子 iframe01（name="child-1" src="child01.htm" ）
　子 iframe02（name="child-2" src="child02.htm" ）
　　　(child02.htm内 )
　　　孫 iframe-a (name="mago-a" src="mago-index.htm")
　　　孫 ihrame-b (name="mago-b" src="mago-menu.htm")
　　　孫 iframe-c (name="mago-c" src="mago-content.htm")
　　　（mago-content.htm内）
　　　　ひ孫 iframe-gch1（name="khead"　src="gc-a.htm")
　　　　ひ孫 ihrame-gch2 (name="kmenu" src="gc-b.htm")
　　　　ひ孫 iframe-gch3 (name="kcontent" src="gc-c.htm")

ひ孫に当たるiframe-gch3のgc-c.htm内から親ウインドウiframe01内にある
child01.htmの背景色を変えたいと考え，いろいろ試していますが
上手く行きません．

苦肉の策として背景色を変えたhtmを用意し下記のようにしてみましたが
動きませんでした．
gc-c.htm内 javascript
function open01(){window.open('別file', 'child1');}

もしくは，子iframeのchild01.htm内にある
function ch01(){document.body.background='gray.gif';}
をgc-c.htm内から動かす方法がありましたらご教示下さい．

よろしくお願いします．

質問者からの補足コメント

• 回答者様へ
  すべてを同じディレクトリーの階層下に置くことにより，解決致しました．やはり知識不足が原因だったようです．解決の糸口になりました回答をベストアンサーに選ばせて頂きました．
  あまり問題にならない質問への回答をありがとうございました．

    補足日時：2018/02/26 23:32

No.1 ベストアンサー 回答者： fujillin 回答日時： 2018/02/26 13:51

こんにちは

同一ドメインならば、単純にparentを辿って該当するdocumentを取得すればよさそうに思えますが・・・

window.parent.parent.parent.document.querySelector("iframe[name='child-1']").contentWindow.document.querySelector("body").style.backgroundColor = "red";

とか。

この回答へのお礼

早速の返答ありがとうございます．No2のyambejpさんもご指摘の通り，最初はそれで簡単にできると思っておりました．ところが，親ウインドウ内のiframe01だけが変わらなかったのです．”同一ドメイン”にヒントを得て，すべてのhtmlを同じフォルダに置くと，回答欄一行目の書式でいとも簡単に変えることが出来ました．確かに，子のiframe0２以降はそのフォルダーの階層下にあります．
また，教示いただいたquerySelectorを使った書式でも変えられませんでした．　
ディレクトリ構造も考えないとだめなのかなと思いはじめています．

お礼日時：2018/02/26 22:57

No.2 回答者： yambejp 回答日時： 2018/02/26 14:30

parent.parent.parentとたどるかtopからたどるかのどちらかでは？

この回答へのお礼

早速の返答ありがとうございます．　当初ご指摘いただいた書式（両者のどちらか）で簡単にできると思っておりました．ところが上手く変えられませんでした．tfujillinさんへのお礼にも書きましたが，htmlファイルのディレクトリーが同一階層下にないと上手く行かないのかな？　と思い始めています．
私の理解が浅いために起こっている事かも知れません．

お礼日時：2018/02/26 23:04