속성선택자를 이용해서 링크에 스타일 입히기

a.mailto{

background: url(mail.png) no-repeat right top;

padding-right: 18px;

}

a.pdflink{

background: url(pdf.png) no-repeat right top;

padding-right: 18px;

}

$(document).ready(function(){

$('a[href^=mailto:]').addClass('mailto');

$('a[href$=.pdf]').addClass('pdflink');

$('a[href^=http][href*=henry]').addClass('henrylink');

});

$('a[href^=mailto:]').addClass('mailto');

<A>태그 중에서 'href'속성의 값이 mailto: 로 시작하는 <A>태그에 클래스 mailto 를 적용한다.

$('a[href$=.pdf]').addClass('pdflink');

<A>태그 중에서 'href'속성의 값이 .pdf 로 끝나는 <A>태그에 클래스 pdflink 를 적용한다. 

$('a[href^=http][href*=henry]').addClass('henrylink');

<A>태그 중에서 href 속성의 값이 http 로 시작하고 href의 속성 값 중에 henry 를 포함하는 <A>태그에 클래스 henrylink 를 적용한다.

* 속성 선택자들은 문자열의 시작부분(^) 또는 끝부분($), 임의의 위치(*)를 가르키는 정규 표현식 패턴을 지원한다.