iFrame 内の要素へのアクセス iFrame 内の要素へのアクセスは、Web 開発で遭遇する一般的な課題となる場合があります。 iFrame は、外部コンテンツを Web ページに読み込むために使用される埋め込みフレームであり、その内部要素と対話する方法を理解することが重要です。 質問: を取得するにはどうすればよいですか? 内にある要素?</p> <p><strong>回答:</strong></p> <p></p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var iframe = document.getElementById('iframeId'); var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;</pre><div class="contentsignin">ログイン後にコピー</div></div> <p></p> <div> を取得するには<div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var iframe = document.getElementById('iframeId'); var innerDoc = iframe.contentDocument || iframe.contentWindow.document;</pre><div class="contentsignin">ログイン後にコピー</div></div> <p>または、「||」を使用してコードを簡略化することもできます。演算子:</p> <p></p>このコードは、iframe の contentDocument プロパティと contentWindow.document プロパティの両方をチェックして、内部ドキュメント (iframe コンテンツ) を取得します。<p><strong>内部ドキュメントを取得したら、次のことができます。メイン ページの要素と同様に、その要素を操作します。たとえば、<div> を取得できます。 innerDoc.getElementById('divId').</strong></p> <p>重要な注意:</p> <ul> <li>iframe はプライマリ ページと同じドメインに配置する必要があることに注意することが重要です。クロスサイト スクリプティングの問題を防ぐため。クロスサイト スクリプティングは、あるドメインのスクリプトが承認なしに別のドメインの情報にアクセスするときに発生します。このトピックの詳細については、次のリソースを参照してください。</li> <li>MDN: <iframe>スクリプト</ul>MDN: 同一オリジン ポリシー: クロスオリジン スクリプト API アクセス</div>
