window.parentとwindow.opennerの違いのご紹介_基礎知識-jsチュートリアル-php.cn

window.parentとwindow.opennerの違いのご紹介_基礎知識

WBOY

リリース： 2016-05-16 17:54:31

オリジナル

1209 人が閲覧しました

今日は、js のいくつかのオブジェクトの違いと使い方をまとめます。
まず、parent.window と top.window の使い方について話しましょう
"window.location.href" と "location.href"はこのページへのジャンプです
「parent.location.href」は前のレイヤーへのページジャンプです
「top.location.href」は最も外側のページジャンプです
例:
A の場合、 B, C ,D はすべて jsp、D は C の iframe、C は B の iframe、B は A の iframe です。 D の js が次のように書かれているとします
"window.location.href" , "location.href": D ページジャンプ Go to
"parent.location.href": C ページジャンプ
"top.location.href": A ページジャンプ
これでようやく使い方が分かりました接続時のターゲット:
_blank : ウィンドウを再度開きます
_parent: 親ウィンドウがリダイレクトを実行します
_self: セルフページのリダイレクト
_top: 最初の親ウィンドウのリダイレクト
要約すると、上:parent.window: 親 Window オブジェクト top.window: 最初の親ウィンドウのオブジェクト
window.parent と window.openner の違いに注目してみましょう
window.parent は親を呼び出す iframe ページですiframe から埋め込みたい場合は、window.parent を使用して外部ページにアクセスできます。
例は次のとおりです。 >
コードをコピー

コードは次のとおりです: 親ページ< ;/title> </span><body> </div><div> 🎜><input type="text" name=" ユーザー名" id="ユーザー名" /><br /> <div class="codebody" id="code50645"><iframe src="b.html" width="400px" height=" 300px"></iframe> <br>< ;/div> <br></form><BR></body> <br></html> <br><br> <br> B.html <br><br><br><br><br>コードをコピー<br><br><br> コードは次のとおりです。</div> <br> <br><html> ><head> <div class="codetitle"><script type="text/ javascript"> <span>function getpValue() <a style="CURSOR: pointer" data="42359" class="copybut" id="copybut42359" onclick="doCopy('code42359')">{ <u>document.getElementByIdx_x_x_x("span1").innerText=window.parent.document .getElementByIdx_x_x_x("username").value; </u>} </a><script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div> </span><span> テキストボックスの値は次のとおりです。 </span><span id="span1">< /span><br /> </div><input type="button" value="親ウィンドウのテキストボックスの値を取得します" onclick="getpValue();"> <div class="codebody" id="code42359"></body> <br><br> <br>window.opener または hyperlink <a>開かれたページは親ページオブジェクトを呼び出します <br>例は次のとおりです<br>a.html <br><br><br><br><br>コードをコピー<br><br><br> コードは次のとおりです次のように:<br><br> </div><html> <br><title>親ページ ;
function openB()
{
window.open('b.html ','b','width=400,height=200,status=no,toolbar=no,menubar=no, location=no,resizable=yes,left=200,top=100');

form id="form1" action="">

入力値: ハイパーリンクでページ B が開きます

 
b.html 

コードをコピー

 コードは次のとおりです:

 ;span>テキスト ボックスの値は次のとおりです: < ;/span>

一般的に使用される例をいくつか示します。
parent.window と top.window は通常、分割ページ (つまり、frameset または iframe) で使用されます。
フレーム全体からログアウトした後、login.aspx に戻ります:parent。 .window. location='Login.aspx' または
top.window.location='Login.aspx'
window.parent は、フレームワーク
Refresh: window.parent.location でもよく使用されます。 reload(); または、特定のフレームを更新します: window.parent.MainForm.location.reload();
他のフレームの要素値を取得します: window.parent.MainForm.form1.text1.value; opener は主にハイパーリンクまたは window.open() を渡します。値の取得や更新など、自分のページの一部のページを開きます。
Refresh: window.opener.location.reload(); .opener.document.getElement ("txtName").value;
前へ: top.playFrame.history.go(-1);更新: top.playFrame. location.reload();
これらのオブジェクトは非常に便利です。