jQueryでiframe内の要素にアクセスしたい！

Question

jQueryでページ内で読み込んだiframeの中身の要素に対していろいろな処理を行いたいのですが、
普通の書き方ではうまく動いてくれませんでした。

やはりjQueryではiframe内の要素を編集することはできないのでしょうか？

Answer 1

jQueryでiframe内の要素にはcontents()を使えばアクセスできますよ。
たとえば、iframe内のid='main'の中身を取ってきたい場合、以下のように書けば取得できます。

$('iframe').contents().find('#main').html();
簡単ですね。

注意点は、親ページのドメインと、iframe の中のドメインが異なる場合、
JavaScript のセキュリティ制限で一切アクセスできないという制約があるところです。

そういったケースは多くないかもしれませんが、
その場合はiframeではなくajaxなどの非同期通信を使って外部のページを引っ張ってくると
解決すると思います。