現役システムエンジニアの備忘録

技術スキルや用語などの記録を残していきます

フレーム

【JavaScript入門】frame.nameの使い方|フレーム名を取得する方法をわかりやすく解説

投稿日:2019年5月20日 更新日:

JavaScriptのframe.nameとは?フレーム名を取得する方法を初心者向けに解説

frame.name は、特定のフレームに設定されている名前(name属性)を参照するためのプロパティです。
フレーム構造を持つページで、別フレームを識別したいときに利用します。



frame.nameとは?

フレーム名は、<frame> タグの name 属性または id 属性で指定されます。

<frame name=”menu”>

このフレームの名前を取得するには次のように書きます。

let n = parent.frames[2].name;

→ 親フレーム内の 3 番目のフレーム名が変数 n に代入されます。



frames[] と組み合わせて使う

フレームは frames 配列に格納されているため、番号で参照することもできます。

let frameName = top.frames[0].name;

→ 最上位フレーム内の 1 番目のフレーム名を取得します。

フレーム名を使うメリット

  • 複数フレームを扱う際に識別しやすい
  • フレーム名を使って location や document を操作できる
  • frames[番号] よりも可読性が高い



注意点

  • フレーム(frameset)は HTML5 では非推奨
  • モダンWebでは iframe の使用が一般的
  • 異なるドメインのフレームにアクセスすると同一オリジン制限でエラーになる

まとめ

  • frame.name はフレーム名を取得するプロパティ
  • frames[番号] やフレーム名と組み合わせて利用できる
  • フレーム操作の基本として理解しておくと便利

関連リンク

このブログは Xserver 上の WordPress で運用しています。
表示速度が速く、安定しているのでブログ初心者にもおすすめです。
レンタルサーバー エックスサーバー

-フレーム
-

執筆者:

関連記事

【JavaScript入門】parent・top・selfの使い方|フレーム階層の参照方法をわかりやすく解説

JavaScriptのparent・top・selfとは?フレーム階層を参照する方法を初心者向けに解説 parent・top・self は、フレーム(またはウィンドウ)同士の階層関係を参照するためのプ …

【JavaScript入門】Frameオブジェクトとframes配列の使い方|フレーム参照・frames.lengthをわかりやすく解説

JavaScriptのFrameオブジェクトとは?frames配列・フレーム参照方法を初心者向けに解説 Frameオブジェクトは、ウィンドウ内に配置されたフレーム(<frame> 要素)を …

【JavaScript入門】frame.locationの使い方|フレームのURL(URI)を参照する方法をわかりやすく解説

JavaScriptのframe.locationとは?フレームのURL(URI)を参照する方法を初心者向けに解説 frame.location は、特定のフレームが現在表示しているページ(URI)を …