Summary
<a>タグの href属性の末尾が '.pdf' , '.doc' ,'.zip'の要素をピックアップ.
対象の<a>タグにclass名を付加する.
例では,pdfLink , docLink, zipLinkというclass名を使用.
各々のclassには,拡張子と対応する画像が指定してある.
Source
リンク先がPDF,Wordファイル,Zipファイルの<a>タグに,class名を付ける.
function fileLinks() {
var fileLink;
if (document.getElementsByTagName('a')) {
for (var i = 0; (fileLink = document.getElementsByTagName('a')[i]); i++) {
if (fileLink.href.indexOf('.pdf') != -1) {
fileLink.setAttribute('target', '_blank');
fileLink.className = 'pdfLink';
}
if (fileLink.href.indexOf('.doc') != -1) {
fileLink.setAttribute('target', '_blank');
fileLink.className = 'docLink';
}
if (fileLink.href.indexOf('.zip') != -1) {
fileLink.setAttribute('target', '_blank');
fileLink.className = 'zipLink';
}
}
}
}
window.onload = function() {
fileLinks();
}
a:hover {
text-decoration: none;
}
.pdfLink {
padding-right: 19px;
background: url(pdf.gif) no-repeat 100% .5em;
}
.docLink {
padding-right: 19px;
background: url(doc.gif) no-repeat 100% .5em;
}
.zipLink {
padding-right: 17px;
background: url(zip.gif) no-repeat 100% .5em;
}
Reference
maratz.com - 2005-01-13 - PDF Links Labeling
http://www.maratz.com/blog/archives/2005/01/13/pdf-links-labeling/
maratz.com - PDF Link Labeling Example
http://webdesign.maratz.com/lab/pdf_links_labeling/