ホームページ >ウェブフロントエンド >CSSチュートリアル >クロスドメイン iframe から計算されたスタイルを取得するにはどうすればよいですか?

クロスドメイン iframe から計算されたスタイルを取得するにはどうすればよいですか?

Barbara Streisand
Barbara Streisandオリジナル
2024-12-05 04:05:16518ブラウズ

How Can I Get Computed Styles from a Cross-Domain Iframe?

クロスドメイン コンテンツから計算されたスタイルを取得する方法

問題:

の計算された高さと幅の値にアクセスするクロスドメイン iframe の要素は、特にアクセスできない場合に困難になる可能性があります。 iframe のコンテンツを直接参照します。

解決策:

ブラウザ固有の機能の使用:

  • Firefox、オペラ、サファリ: window.getComputedStyle(element)
  • IE: element.currentStyle

クロスドメイン コンテンツへの適用:

クロスドメイン コンテンツから計算されたスタイルを取得するには、最新の window.getComputedStyle を使用できます。ブラウザまたは IE の element.currentStyle。ただし、これらの関数は現在のドキュメント内の要素に対してのみ機能するため、使用する前に iframe の DOM に移動する必要があります。

例 (WebKit):

window.getComputedStyle(document.getElementById("frameId"), null).getPropertyValue("height")

ネイティブ jQuery 関数:

または、 jQuery の .height() 関数を使用すると、プロセスが簡素化されます:

$('#frameId').height();

追加メモ:

  • window.getComputedStyle が返すことに注意することが重要です。計算されたスタイルを持つ不変オブジェクト、element.currentStyle は要素のスタイルとして変更できるライブ オブジェクトを返します。変更します。
  • 後で選択しやすくするために、iframe 内の head 要素に ID を追加する必要がある場合があります。

以上がクロスドメイン iframe から計算されたスタイルを取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。