- ベストアンサー
iframeについて質問です。
iframeについて質問です。 取得先のページを全体を読み込むことはできるのですが、 指定したid属性だけを読み込むことってできるのでしょうか。 css、html5で対応できれば嬉しいです。 css、html5でできない場合jsでやり方があれば教えてもらえたら嬉しいです。 よろしくお願いいたします。
- rossi46mail
- お礼率96% (251/259)
- CSS
- 回答数4
- ありがとう数7
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (3)
- hymat
- ベストアンサー率58% (95/162)
じゃなかった xhr.open('GET', 'http://ここにURLを書く/'); の部分を httpなど抜きで './xxx.txt'とかにしてください。
お礼
ありがとうございます。 './xxx.txt'の件ですが相対パスにするということでしょうか。 もしくはhttp://を./に変更するということでしょうか。 例：http://item.rakuten.co.jp/shopname/itemname/ の場合 ./item.rakuten.co.jp/shopname/itemname/ですか？
- hymat
- ベストアンサー率58% (95/162)
スマホの場合は同一サーバー上のファイルの指定がFQDNだとダメっぽいですね。 <input type="button" value="get data" onclick="ajaxGet('http://localhost/target1.html');"> ↓ <input type="button" value="get data" onclick="ajaxGet('target1.html');">
お礼
ご回答ありがとうございます。 下のno.3にご返信いたします。
- hymat
- ベストアンサー率58% (95/162)
セキュリティ的にiframeの内容はイジれないのでdiv等を使います。特定の部分だけ読み込むわけにいかないので、いったん全体を読み込んで、その後、idを指定して取り出します。ただし読み込む相手先ページがAllow-Originを制限している場合はできません。 <html> <body> <script> function ajaxGet() { var xhr=new XMLHttpRequest(); xhr.open('GET', 'http://ここにURLを書く/'); xhr.onreadystatechange=function(){ if(xhr.readyState == 4 && xhr.status == 200){ document.getElementById('div1').innerHTML=xhr.responseText; document.getElementById('data1').innerHTML= document.getElementById('ここにidを書く').innerHTML; } }; xhr.send(uri); } </script> <div id="div1" style="display:none;"></div> <div id="data1" style="border:solid 1px red;width:512px;">no data</div> <input type="button" value="get data" onclick="ajaxGet();"> </body> </html>
お礼
ありがとうございます！ できました！ 1点だけご相談があります。 スマホの場合IDを取得できません。 スマホでも取得できる方法はありますか？ よろしくお願いします。
関連するQ&A
- iframe内cssの切り替えが出来ない
ただいま、styleswitcher.jsを使用しスタイルを動的に切り替えられるページを作成中です。 そこでご質問ですが、iframeを使用しているのですが、スタイルを切り替えてもiframe内のcssは同時に切り替えられません。 どなたか切り替えと同時にiframe内のスタイルも同時に切り替える方法をご存知の方がいらっしゃいましたら教えてください。styleswitcher.jsでなくても構いませんので、よろしくお願いいたします。
- ベストアンサー
- CSS
- iframeについての質問
iframeについての質問ですが、例えば、トップページ、日記のページがあるとします、日記のページにはiframeがあり、iframe内に、毎日の日記を別のhtmlで作ったものを表示していこうと思います。 トップページから、日記ページのiframe内に、トップページより、指定した日にちのhtmlファイルにリンクするにはどのようにしたらよいでしょうか？
- ベストアンサー
- HTML
- JavaScript 配列とiframe
カテゴリを誤って投稿してしまいました。 インラインフレームを二つ（iframe1,iframe2）用意し、jQueryにてクリック出来るようにしたdiv要素のクリックで、それぞれのリンク先をJavaScriptの配列に収めた連番通り、1,2,3,4…htmlと表示させたいのですが、二つの配列を使用すると連番通りに表示されなくなります。（一つの配列使用では連番通りに表示されます。） 1クリックで、iframe1にはiframe1link1.htmlの表示、iframe2にはiframe2link1.htmlの表示。クリックごとにlink2,link3と順番どおりに表示する、これを可能にするお知恵を拝借したいと思い投稿させて頂きます。よろしくお願いいたします。 =＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ （JavaScript(1)iframe1.js） var URLs=new Array(); var cnt=0; URLs[1]="iframe1link1.html"; ******* URLs[10]="iframe1link10.html"; function Jump1(){ cnt++; if(cnt==11) {cnt=0;} iframe1.location.href=URLs[cnt]; } ==＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ （JavaScript(2)iframe2.js） var URLs=new Array(); var cnt=0; URLs[1]="iframe2link1.html"; ******* URLs[10]="iframe2link10.html"; function Jump2(){ cnt++; if(cnt==11) {cnt=0;} iframe2.location.href=URLs[cnt]; } =＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ （HTML） <!doctype html> <link rel="stylesheet" href="./css/style.css" type="text/css"> <script src="iframe1.js"></script> <script src="iframe2.js"></script> <title>sample</title> <div id="container" class="div" onclick="Jump1();Jump2()"> <div id="main"> <iframe src="./iframe1link0.html" id="iframe1"></iframe> <iframe src="./iframe2link0.html" id="iframe2"></iframe> </div> </div> これでは連番通りにいかない。 =====＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
- ベストアンサー
- JavaScript
- htmlのiframeについて
iframeを使用する際に特定のidのエリアのみ表示させることはできますか？ 例：取得先サイト ■ヘッダ ■コンテンツ１（id="area1"） ■コンテンツ２（id="area2"） ■フッタ 取得元のサイト（表示させたいサイト）に、上記サイトのコンテンツ2だけを引っ張ってきたいと考えています。 ヘッダやコンテンツ１、フッタはiframeに表示させたくありません。 コンテンツ２のみiframeに表示させたいです。 こういったことは可能でしょうか。 よろしくお願いいたします。
- ベストアンサー
- HTML
- iframe内MENU
ほんと色々お世話になります。 iframeの件でご質問申し上げます。 iframe内に別ページで作成しました。 メニューページを表示させています。 （別ページ作成したｃｓｓmenuを丸投げしている感じです。 <iframe src="css_tatoeba.html"frameborder="0" height="40" scrolling="no" width="554"></iframe> こんな感じです。） 別ページでリンクを貼り親ページで試してみるとiframe内にリンク先が 一部表示されてしまいます。（レイアウト崩れのような感じで） iframe内ではなく、新たなページに表示させたいのですがどうすればよろしいのでしょうか？ 色々試したのですが上手くいきません。 教えて頂ければ幸いです。
- ベストアンサー
- HTML
- iframeからのリンクでスクロールさせるには
scrollsmoothly.jsを使用させもらっています。 iframe内にtarget="_top"でリンクを設置。 ※リンク先はiframeを表示しているページ内へのアンカーリンクです。 iframeでscrollsmoothly.jsを読み込んでもスムーズスクロールされません。 iframeが表示されているページに読み込んでも同じです。 target="_top"を外せばフレーム内でスクロールするのですが、 フレーム内でリンクさせたいわけではないので、どうしてもこれを外せません。 iframe内からのアンカーリンクでスムーズスクロールするにはどのようにすればよいでしょうか。 よろしくお願いします。
- 締切済み
- JavaScript
- iframeの横スクロール
iframeを使ってほかのページを表示させているのですが、 どうしても横スクロールバーが出てしまうのでcssのbody要素に 「overflow-x: hidden;」と入れました。 確かにiframeの横スクロールバーは消えましたが、ページの横スクロールも消えてしまいました。 div idでiframeを囲ってcssでその場所だけに「overflow-x: hidden;」を入れると今度は横スクロールバーが消えません。。 色々調べてみたのですが同じような人がいないようで； 詳しい方教えていただけないでしょうか。 （説明がへたくそですみませんm(_ _)m）
- ベストアンサー
- その他([技術者向] コンピューター)
- IFRAMEを使っているのですが
indexはフレームも何もない普通のページで、ENTERをクリックして入った次のページに IFRAMEを使っているページを作っています。 このページに入ると、IFRAMEの中にindexが表示されてしまい、困っています。 このIFRAMEの中に表示するページを指定する事はできますか？
- ベストアンサー
- HTML
- iframe内からのリンク
少々複雑ですいませんがお願いします。 ・index.htmlにname="contents"でiframeを設置 ・iframe内に先頭に戻るリンクを最下部に設置したい（ここでいう先頭はページ全体のトップ） ・上記リンクを押した際にiframe内は現時点のページのまま index.html ------------- <body> ヘッダー内容 <iframe src="フレーム内ページ.html"></iframe> + + + フレーム内ページ ----------- <body> <a name="top"></top> ページの内容 + + + このままだとフレーム内ページの先頭に飛ぶのは周知なので。 条件として、 ・CSSは使用可能。 ・javascriptは使えるが、使わないですむならその方が良い。 ・環境上jQueryは不可。 ・flash他は考えない。 カテゴリが異なるのかもしれませんが；よろしくお願いします。
- ベストアンサー
- HTML
- iframeを使わずに…
いつもお世話になっております。 毎度毎度申し訳ありませんが、お知恵を貸してください。 今ネットショップを作ろうとサイト作成しています。 トップページ右上、一部のスペースに、管理人の紹介や更新情報などを載せたいと考えています。 最初、ここにはiframeを使おうと考えていました。 トップページ右上の小さなスペースを利用して、管理人の紹介や更新情報などのページを、iframeを使って切り替えていこう、と。 でもframeやiframeはSEO的にあまりオススメされない方法だと知り、iframeを使わずに同様のことが出来ないかと調べていました。 でも、iframeを使わずにスクロールバーを出す方法や、SSIを利用したリンク管理の効率化などの情報はあったのですが、埋め込んだページだけをリンクで切り替える、という私の探す情報は見つかりませんでした。 そこで質問なのですが、このようなことはiframeを使わなければ出来ないことなのでしょうか？ 以前、CSSで似たようなことをしていたサイトがあるという話しを聞いたことがあるのですが、探し出すことが出来ませんでした。 もしよろしければ、アドバイスを御願い致します。
- ベストアンサー
- CSS
お礼
なんどもご回答いただいて本当にありがとうございました。 ベストアンサーが1つしか付けられないことが悔しいですが、本当に感謝しております。ありがとうございました。