jsにおけるwindow.nameの特徴と機能を詳しく解説

ウィンドウに name 属性があることは以前から知っていましたが、それが何に使われるのかは知りませんでした。今日、時間をかけて調べてテストしたところ、次のことがわかりました。それは興味深い JS API 属性であることがわかります。

推奨チュートリアル: 「JavaScript ビデオ チュートリアル 」

すべてのブラウザには window.name

ウィンドウがあります。 name はすべてのブラウザに共通の属性で、ブラウザ ウィンドウの名前を示します。デフォルトは空の文字列であり、すべてのブラウザは空の文字列です。

#これは読み取りおよび書き込み可能な属性です。構文は次のとおりです:

string = window.name;
window.name = string;

例:

window.name = 'zhangxinxu';

window.name

window.name のクロスページ機能には、非常に興味深いクロスページ機能があります。具体的な説明は次のとおりです。 window.name で設定すると、他のページにジャンプしても、この window.name は保持されます。

たとえば、次のデモについては、ここをクリックしてください:

window.name とリンク アドレスのテスト デモ

ページには 2 つのハイパーリンクがあり、[ハイパーリンク時] をクリックします。の場合、

name 属性値は現在のページの window に設定されます:

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

<a href="./window-name.html" onClick="window.name=&#39;zhangxinxu-1&#39;;">点击我看看目标页面的window.name</a>
<a href="./window-name.html" onClick="window.name=&#39;zhangxinxu-2&#39;;">点击我看看目标页面的window.name</a>

次に、window-name.html ページが行うことは非常に簡単です (以下のコードを参照)。ページがロードされた後に

window.name 値を出力することです。

<!-- window-name.html页面中的代码 -->
<p>window.name值是：<output id="output"></output></p>
<script>output.textContent = window.name;</script>

最終的な効果は次のとおりです:

• 最初のリンクをクリックすると、現在のページが設定されます

  window.name='zhangxinxu-1' , このとき、window-name.html ターゲット ページで表示される情報は次のようになります。 window.name

  の値は
'zhangxinxu-1'

です。

• この時点で、ソース ページに戻ります:

  
  

# #2 番目のリンクを再度クリックします:

ターゲット ページに
• window.name# が表示されることがわかります。 # #値は

  'zhangxinxu-2'

  です。

• この機能は非常に興味深いものです。ソース ページに設定された

  window.name 値を実際に記憶できます。これは次のとおりです。 document .referrer に相当するものはさらに使いやすく、任意の文字を直接指定できますが、document.referrer

  は URL も処理する必要があります。

たとえば、上記の例では、window-name.html ページはどのリンクから来たのかを認識し、さまざまなソースに従ってさまざまな処理を行うことができます。 URL を介してパラメーターを送信します。

新しいウィンドウで開かれた window.name は無効です

window はウィンドウを意味するため、上記の <a>Link 新しいウィンドウが開くときに

target="_blank"

を設定すると、ターゲット ページの

window.name

は空の文字列 '' になります。これは、

window.name

が設定されたウィンドウではなく、新しいウィンドウであるためです。 したがって、window.nameページ間でのデータ転送には依然として一定の制限があります。 window.name はドメイン間では使用できません。

window.name

の値はブラウザによって決定されます。 . フォームが移動するので、フォーム内にいれば値を共有できるので、クロスドメインのデータ取得が実現できます。これは、以前は「ウィンドウ」と呼ばれたクロスドメインの手法としてよく知られていました。 name Transport"。興味がある場合は、この 2008 年の古い記事 を参照してください。ここでは詳しく説明しません。このクロスドメイン メソッドは JSONP より安全です。

それでは、なぜ質問が拡張されないのかについてお話したいと思います。クロスドメイン通信を実現するために window.name を使用するのは役に立たない方法だからです。postMessage を使用してください。クロスドメインおよびクロスドキュメント。Communication が置き換えられ、より優れており、より安全で、より強力です。

有此看来，现在window.name这个属性已经没什么卵用了，除了上面提到了偶尔可以用来在同一窗口前后页面之间做简单的数据传递，包括JSON字符串数据。

window.name = '{ "foo": "bar" }';

最后总结一下

　1. window.name可读可写，指支持字符串；

　2. window.name的值跟着浏览器窗口走的，不是跟着页面走的；

　3. window.name没什么卵用，知道他没用就是很有用的知识。

好，就这么多，让我搞清楚了传说中的window.name到底是个什么鬼，我表示很满足。

原文地址：https://www.zhangxinxu.com/wordpress/?p=8947

更多编程相关知识，请访问：编程入门！！

以上がjsにおけるwindow.nameの特徴と機能を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。