lunes, 24 de febrero de 2014

¿Cómo darle estilo a la primera línea de un DIV?

Tenemos una vista en SharePoint 2007 que nos muestra varias columnas. La columna 4 es un campo de varias líneas de texto. Cuando vemos su contenido HTML, vemos que es un DIV con varias líneas separadas por BR.

¿Cómo hacemos para darle estilo a la primer línea?

La respuesta es con un poco de jquery, usando algunos trucos:
  • Por un lado usamos el atributo summary para identificar la vista.
  • Luego agregamos span a cada línea
  • Y luego le damos estilo al primer span

Aquí el código:

$('table [summary=Preguntas frecuentes] tr td:nth-child(4) div')
  .contents()
    .filter(function() {
      return this.nodeType === 3;
    })
      .wrap( "<span></span>" )
      .end()
    .filter( "br" )
//    .remove()
    ;
$('table [summary=Preguntas frecuentes] tr td:nth-child(4) div span:nth-child(1)').css('font-weight','bold');

Y aquí el resultado:


Espero les sea útil!

0 comentarios:

Publicar un comentario en la entrada