外部リンクアイコンと別窓を開く備忘録(jQuery1.3.2)

いまでは当たり前のように使われてるJavascriptで外部リンクアイコンと別窓を開くスクリプト。

ちょっとググればすばらしいスクリプトがごろごろしてそうなのですが。

勉強をかねて自分で組んでみることにしました(というほどのものでもない嫌な感じ)。

jQuery Script

$(function(){
	//自ドメイン取得
	var myDomain;
	myDomain = document.domain;
	if(!myDomain){
	//ローカルなんかで作業してるときとか
		myDomain = "hogehoge.com";
	}
    //記事のメイン領域だけ走査
	var target = document.getElementById("main");
	if(!target) return;
    //http://とhttps://で始まるURIを探して
	$("a[href^=http://]"||"a[href^=https://]",target).each(function(){
		var urls = $(this).attr("href");
		//http://,https://を含むURIからホスト部分を抜き出して自ドメインと比較
		var extra = urls.split('/')[2];
		if(extra !== myDomain){
                        //自ドメインじゃなかったらtarget="_blank"とclassを付加
			$(this).attr({"target":"_blank","class":"extlink"});
		}
	});
});

Style Sheet

.extlink{
	padding:0 13px 0 0;
	background:url(../img/ico_extra_link.gif) right center no-repeat;
}

たぶんわかる人から見ると
ムダだらけなんでしょうね・・・・ドクロ

一応 Win IE6(そういえば3月1日にIE6のお葬式だそうですね。)、Win IE7、Win FireFox 3.5.8、Opera 9.64、Google Chromeで動作確認しました。


おまけ
ほしいという奇特な方がいれば・・5色入りgifとpngのこのサイトで使ってる外部リンクアイコンセットどうぞ

Trackbacks