window.parentとwindow.opennerの違いを紹介します.
4195 ワード
今日はjsのいくつかの対象の違いと使い方をまとめます. まずparent.windowとtop.windowの使い方を言います. 「window.location.href」、「locations.href」はこのページのジャンプです. 「parent.locations.href」は前のページからジャンプします. 「top.locations.href」は一番外側のページにジャンプします. 例を挙げて説明します A、B、C、Dはすべてjspで、DはCのiframeで、CはBのiframeで、BはAのiframeで、Dの中でjsはこのように書きますと. 「window.location.href」、「locations.href」:Dページジャンプ 「parent.locations.href」:Cページジャンプ 「top.locations.href」:Aページジャンプ 接続時のtargetの使い方がやっと分かりました. _blank:もう一つのウィンドウを開きます. _parent:親ウィンドウがリダイレクトを実行します. _self:自己ページリダイレクト _トップ:最初の親ウィンドウをリダイレクト 以上からわかるように、parent.window:父の窓口のオブジェクトtop.window:最初の父の窓口のオブジェクト 次に重点的にwindow.parentとwindow.opennerの違いを見てみます. window.parentはiframeページで親ページのオブジェクトを呼び出します.iframe内に埋め込まれたページから外部ページにアクセスしたい場合は、直接window.parentを利用して取得できます. 例は以下の通りです A.
<html>
<head>
<title> </title>
</head>
<body>
<form id="form1" action="">
<div>
：
<input type="text" name="username" id="username" /><br />
<iframe src="b.html" width="400px" height="300px"></iframe>
</div>
</form>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function getpValue()
{
document.getElementByIdx_x_x_x("span1").innerText=window.parent.document.getElementByIdx_x_x_x("username").value;
}
</script>
</head>
<body>
<span> ：</span><span id="span1"></span><br />
<input type="button" value=" " onclick="getpValue();">
</body>
</html>
<html>
<head>
<title> </title>
<script type="text/javascript">
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');
}
</script>
</head>
<body>
<form id="form1" action="">
<div>
：
<input type="text" name="username" id="username" /><br />
<input type="button" value=" B" onclick="openB();" /><br />
<a href="b.html" target="_blank"> B </a>
</div>
</form>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function getpValue()
{
document.getElementByIdx_x_x_x("span1").innerText=window.opener.document.getElementByIdx_x_x_x("username").value;
}
</script>
</head>
<body>
<span> ：</span><span id="span1"></span><br />
<input type="button" value=" " onclick="getpValue();">
</body>
</html>