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

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

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