Resaltar texto en página con jquery

Es muy común en algunas páginas web que haya un texto resaltado debido a una búsqueda o palabra clave destacada, esto se puede hacer directamente en la página del lado del usuario/navegador con jquery, evitando resaltar desde el lenguaje de programación usado en el servidor de hosting.

Primero hay que crear un estilo para resaltar el texto

  <style type="text/css">
            .highlight { background-color: yellow }
 </style>

Luego debemos enlazar un plugin de jquery, porsupuesto luego invocar a jquery.

  <script language="javascript" type="text/javascript" src="/js/jquery.highlight-3.yui.js"></script>
Seguido vamos a crear el script que buscará un párrafo <p> con la palabra a destacar, en este caso del ejemplo será laptops.

  <script language="javascript" type="text/javascript">
            $(document).ready(function() {
                $('p').highlight('laptops');
            });
 </script>
Podemos ver un demo real en el siguiente link

Comentarios

Entradas populares de este blog

Superponer una imagen sobre otra con CSS

Script para buscar palabras o textos en una página (html) con Jquery

¿Ganas dinero en Facebook con Página, Grupo, Comunidad, etc?