jueves, 18 de julio de 2013

Selectores de atributo

Nos permite buscar dentro de los atributos de una etiqueta.

$(document).ready(function() {
  $('a[href^=mailto:]').addClass('mailto');  // busca en el atributo donde el principio se = mailito
  $('a[href$=.pdf]').addClass('pdflink'); // busca en el atributo donde el final sea = pdf
  $('a[href*=henry][href!=mailto:henryiv@king.co.uk]').addClass('henrylink');

// busca en el atributo donde el final sea = * cualquer cosa y signo de exclamacion para cosas negativas, los atributos se pueden combinar

a.mailto {
  background: url(images/email.png) no-repeat 100% 2px;
  padding-right: 18px;
}
a.pdflink {
  background: url(images/pdf.png) no-repeat 100% 0;
  padding-right: 18px;
}
a.henrylink {
  background-color: #fff;
  padding: 2px;
  border: 1px solid #000;

<li><a href="/asyoulikeit/">As You Like It</a></li>
<li><a href="hamlet.pdf">Hamlet</a></li>
<li>Henry IV (<a href="mailto:henryiv@king.co.uk">email</a>)
<li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry V</a></li>

No hay comentarios:

Publicar un comentario