著者関連: http://www.lemongtree.com
CSS 属性セレクターを使用して、すべての外部リンクに小さなアイコンを追加して外部リンクとして識別するなど、リンク スタイルを選択的に制御できます。
ただし、CSS の使用にはデメリットもあります。
1. Web 標準を適切にサポートする FireFox などのブラウザのみをサポートします。
2. アンカーポイントやJavaScriptではなく、リンクのみを判断します。 <a href="javascript:void(0);"> が発生した場合、できることは何もありません。
これは js と組み合わせて行うことができます。まずスタイルを記述します。
a.other:リンク、a.other:訪問済み、a.other:アクティブ
{
背景:url("external.gif") 右上; 繰り返しなし;
パディング右:15px;
を
作成しますが、その js では、上記の JavaScript やアンカー ポイントなどのリンクの多様性を考慮する必要があります。 画像リンクの場合は、スタイルを適用しないでください。
<script type="text/javascript">
window.onload = 関数()
{
var aList = document.getElementsByTagName('a');
var iCount = aList.length;
for(var i = 0;i<iCount;i++)
{
if(!chkMyLink(aList[i].href,aList[i].innerHTML))
{
aList[i].className ='その他';
}
}
}
//s はリンクの URL、innerhtml はリンク テキストです
関数 chkMyLink(s,innerhtml)
{
if(innerhtml.replace( /^s*/,"").match(/^<img/gi)) true を返します。
var reg = /^http:///gi;
if(s.match(reg))
{
reg = /^http://www.lemongtree.com/gi;
if(s.match(reg))
{
true を返します。
}
それ以外
{
false を返します。
}
}
true を返します。
}
</script>
これで効果がわかります。