*

リファラーによってiframe内のリンク先をjavascriptで変更する

公開日: : ノウハウ

CSS_seiketukannoarucs1292500

リファラーによってインラインフレーム内にあるリンクのリンク先を変えれたら便利になるなと思って javascript で自作してみました。こんな事したいと思う人は多分いないニッチなものだと思います。

どういう時に使いたかったかと言うと、複数の違うドメインのページから一つのページをインラインフレームで読み込みます。インラインフレームの中にはリンクがあります。

普通通り a タグでリンクを貼ればリンク先は一つのページのみです。インラインフレームを読み込んだサイトによってリンク先を変えたかったのです。

これを javascript で実現してみました。javascript をオフにしている人は…。想定外です。

まずはソースを御覧ください。このスクリプトはインラインフレーム内に記述しています。

<script type="text/javascript" language="javascript">
<!--
	var parentURL =document.referrer;
	var selectURL;
	if(String(parentURL).indexOf("webmist")!=-1){
		selectURL = "http://webmist.info/sample.html";
	}else if(String(parentURL).indexOf("pocket-se")!=-1){
		selectURL = "http://pocket-se.info/sample.html";
	}
	document.open();
	document.write("<a href='" + selectURL + "' target='_top'>リンクテキスト</a>");
	document.close();
-->
</script>

まずは javascript でリファラー(インラインフレームを読み込んだサイトのURL)を取得し、リファラーに含まれている文字列によってリンク先となる URL を selectURL という変数に格納しています。

あとは、javascript で a タグのリンクを書き出しています。

これで何が良くなったのか?このスクリプトを使わなかったらドメインごとにインラインフレーム内のページを作らなくてはいけませんでしたが、これによってインラインフレームのページは一つで済むようになりました。

前述の通り、こんな事をしたいという人は多分いないと思います。何かの参考になれば幸いです。

上部広告

  • Pocket

おすすめトピックス

関連記事

css3
CSS3で要素の2番目以降、1番目以外にスタイルを適用する擬似クラス

スタイルシート(CSS)はウェブサイトにデザインを適用するための言語。そのスタイルシートのバージョンは今では3になっており、かなり表現力豊かで優秀になっています。 例えば ul li タグのリストの場合、従来の CSS2 […]

iframe内のjavascriptを無効にする方法

html の iframe(インラインフレーム)とは、一つのページ内に小窓を作ってその内部に別ページや別サイトを表示させるタグです。iframe 内のページは自分で作る事もありますが、他の人が作る事もあります。どういう事 […]

スマホを操作する手
スマホでWeb閲覧時代にスマホサイトでNGだと思う事3つ

ちょっと前まではインターネットを見るなら、通販するならパソコン!という時代でしたが、既にこれは終わった時代です。ここ2,3年は、インターネットを閲覧、通販においてもスマートフォン率がだんだん上昇しています。これは当サイト […]

https通信下でjavascriptが動かない場合の対処法

https 通信下で javascript が動かない!とお困りという事は、もしかしてあなたのページは特定のページだけ https 通信を行っているのではないでしょうか?例えばログインページ、決済ページのみ暗号化を行う […]

スマホサイト
プラグイン無しで簡単に実現するスマホサイトの上からドロワーメニューの作り方【jQuery】

近年どこでもスマートフォン向けサイトが用意されているのが当たり前です。スマートフォンを使っていればいつも何気なしにスマートフォンサイトを見ていると思います。 そのスマートフォンサイトをちょっと思い出してみてください。 こ […]

MP3ダウンロード
MP3を1クリックだけでストリーミングせずにダウンロードする方法

私はこのサイトとは別に、効果音や BGM の素材サイトを運営しています。ふとそのサイト名で google 検索をしてみた所、驚くべき光景を目にしました。 ポケットサウンドというのがそのサイト名なのですが、Google の […]

上部広告

著者について

名前:Azell
作曲したり風景写真撮ったりWeb制作したりする人です。 好きな事を楽しくブログに綴れていけたらと思います。

フォローはこちら

       

上部広告

       
お化け階段
根津のお化け階段と言われる由来とは一体何か?【東京都文京区】

東京都文京区根津にお化け階段と呼ばれる場所があるようです。偶然

イギリスの朝食
世界各地の朝食を食べられる外苑前の「ワールドブレックファストオールデイ」で優雅なランチ

東京の港区北青山には世界各地の伝統的な朝食を食べられるお店があ

HTC10をAndroid7.0にしたらTwiccaの設定が開けなくなったのでTwidereを導入した

2017年4月19日より au スマートフォン HTV32(H

月曜日に財布を忘れる時が多いので対策を考えた

財布、携帯電話、家の鍵など毎日の生活に日々身につけている物がた

Excel2010で最近使用したブックの一覧に表示しない、または表示数を指定する方法

Excel2010 で画面上部のタブからファイルをクリックして

→もっと見る