Buscar texto en nuestra web con javascript ( jQuery )

votar

Johan Burkard comparte con nosotros esta función/tip en jQuery para resaltar partes de nuestra página conforme a una búsqueda de texto dada.

JAVASCRIPT:
  1. $.fn.egrep = function(pat) {
  2.  var out = [];
  3.  var textNodes = function(n) {
  4.   if (n.nodeType == Node.TEXT_NODE) {
  5.    var t = typeof pat == 'string' ?
  6.     n.nodeValue.indexOf(pat) != -1 :
  7.     pat.test(n.nodeValue);
  8.    if (t) {
  9.     out.push(n.parentNode);
  10.    }
  11.   }
  12.   else {
  13.    $.each(n.childNodes, function(a, b) {
  14.     textNodes(b);
  15.    });
  16.   }
  17.  };
  18.  this.each(function() {
  19.   textNodes(this);
  20.  });
  21.  return out;
  22. };

Un ejemplo:

Pulsa aqui para resaltar todos los nodos que contengan la palabra buscar.

  • Google sirve para buscar.
  • Esta frase no contiene la palabra del ejemplo
  • También puede BuScAr sin ser sensible a mayúsculas/minúsculas
  • Otra frase de relleno.
  • Ya no sé qué más buscar

Un comentario a esta entrada

  • Gravatar JM dijo
    el # Viernes, 17 de abril del 2009 a las 08:27

    1

    Estoy intentado pasar el texto a buscar del valor de un input pero no hay forma de que me funcione. Me podéis ayudar? Gracias

Deja tu opinión

Sólo se permiten las etiquetas XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Post anteriores/siguientes:

Post (quizás) relacionados:

  • JS – Limitar el uso de determinados caracteres en una caja de texto

  • Interesante opción para limitar mediante Javascript el uso de determinados caracteres en una caja de texto. Como siempre, con jQuery....
  • 40 excelentes tutoriales sobre jQuery

  • Si estás interesado en dotar de interactividad a tu web, pero nunca has oído hablar de jQuery o Javascript, InstantShift ha recopilado una lista muy...
  • Copiar el texto de un Alert o Msgbox

  • Si alguna vez necesitas copiar el texto de una ventana de error de un programa de Windows, un alert de Javascript o algún texto similar,...
  • Plugin jQuery para efecto de volteo

  • Flip ! es un plugin jQuery que nos permitirá una interesante animación de vuelo y transformación (volteándola) sobre cualquier elemento de nuestra página ...
  • Enlaces de Desarrollo Web

  • Ay Carmele, tanto que experimentar y tan poco tiempo... Vivalogo hace una recopilación de las 40 mejores Aplicaciones para Redes Sociales Gratuitas, Open Source y Descargables Creando...