*

リファラーによって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 = "https://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

おすすめトピックス

関連記事

リストの表示数を制限する
HTMLでulタグのリスト項目の表示数を制限する

HTML で ul タグを使えば以下のようなリストを作れます。 リスト リスト リスト このようなやつですね。順序なしリストと呼ばれて、何かを箇条書する時に便利です。html タグでは以下のように記述します。 この箇条書 […]

これを見れば簡単!スマホサイトのフッターメニューをサクッと作るサンプル

スマートフォンなどのモバイル端末でウェブサイトを見る人が急増し、今の時代スマートフォン用サイトを作る事が当たり前となりました。スマホ用に別の html ファイルを用意するより一つの html で両方に対応するレスポンシブ […]

画像付きリスト
関連記事などに画像付きリストをCSSで簡単に作るサンプル

画像つきリストとは上図のようなイメージです。しばしばブログなどでは関連記事や人気記事の表示などに使われている事が多いですし、インターネットショッピングサイトではサイドメニューの商品カテゴリリストに採用されています。 ポイ […]

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

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

動く炭酸
飲み物の写真がリアルに動き出す!フリーソフトSizzTassの使い方

知り合いに聞いたのですが、「料理の写真からぐつぐつと煮えたぎる写真を作れるソフトがあるらしいよ。テレビでやってた。」と。最初は何だそれは?と思って意味がよく理解できませんでした。 ソフト名を聞いて調べてみたのですが、確か […]

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

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

著者について

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

フォローはこちら

       

       
どうぶつの森ポケットキャンプで機種変更でデータの引き継ぎや他の端末でプレイできるか?

2017年11月22日に満を持して配信開始された「どうぶつの森

日常のイイ物を味わう滋賀県東近江市の「いよもんカフェ」でランチ

滋賀県東近江市にあるいよもんカフェへ行ってきました。いよもんっ

霊水「善水元水」も湧き出る滋賀県湖南市の善水寺で紅葉散策

滋賀県湖南市の湖南三山の一つである善水寺へ行ってきました。お寺

紅葉の美しい参道を行く、滋賀県湖南市の湖南三山「長寿寺」で紅葉散策

滋賀県の湖南三山の一つに数えられる長寿寺へ行ってきました。紅葉

cssとjqueryでサイトのローディング画面を簡単に実現する作り方【プラグインなし】

現在ロード中を知らせるローディング画面(Now Loading

→もっと見る