由于浏览器的飞速发展，使得现在的网站上面的链接形式也呈现出多样化。我们经常会看到很花哨的链接形式，比如不同的链接显示颜色不一样，不同的链接显示图标不一样等等。这些都可以通过今天我给大家介绍的jQuery特效来实现。
首先看一个效果图吧!
上面的每一个链接前面都有不一样的图标。怎么实现的呢？
看看我们的源代码的前面部分：
<script type="text/javascript">
$(document).ready(function(){
$("a[@href$=pdf]").addClass("pdf");
$("a[@href$=zip]").addClass("zip");
$("a[@href$=psd]").addClass("psd");
$("a:not([@href*=http://www.webdesignerwall.com])").not("[href^=#]")
.addClass("external")
.attr({ target: "_blank" });
});
</script>
标明的是一个<a>的href属性中的一个CSS class。
第二部分将会获取所有href中没有"http://www.webdesignerwall.com" 和/或没有"#"的< a>元素，并添加"external" class和target= "_blank"。如下：
<p><a class="pdf" href="http://www.webdesignerwall.com/file/wdw-logo.pdf">PDF file</a> (wdw-logo.pdf)</p>
<p><a class="psd" href="http://www.webdesignerwall.com/file/wdw-logo.psd">PSD file</a> (wdw-logo.psd)</p>
<p><a class="zip" href="http://www.webdesignerwall.com/file/wdw-logo.zip">Zip file</a> (wdw-logo.zip)</p>
<p><a href="#anchor">#anchor link</a> (#anchor)</p>
<p><a target="_blank" class="external" href="http://bestwebgallery.com/">链接一</a> (http://chenlublog.com)</p>
<p><a target="_blank" class="external" href="http://www.ndesign-studio.com/">链接二</a> (http://www.chenlublog.com)</p>
<p><a href="http://www.webdesignerwall.com/">链接三</a> (http://www.chenlublog.com)</p>
