Búsqueda de texto completo en HTML ignorando etiquetas/&

Question

Recientemente he visto muchas bibliotecas para buscar y resaltar términos dentro de una página HTML. Sin embargo, todas las bibliotecas que vi tienen el mismo problema, no pueden encontrar texto parcialmente encerrado en una etiqueta html y/o fallan al encontrar caracteres especiales que son & -expresados.

---

Ejemplo a:

<span> This is a test. This is a <b>test</b> too</span> 

La búsqueda de "una prueba" encontraría la primera instancia, pero no el segundo.

---

Ejemplo b:

<span> Pencils in spanish are called l&aacute;pices</span> 

Busca "lápices" o "lapices" fallaría para producir un resultado.

---

¿Hay una biblioteca JS que hace esto o al menos una forma de eludir estos obstáculos?

¡Gracias de antemano!

Bruno

Answer 1

Puede usar window.find() en navegadores que no sean IE y TextRange en el método findText() en IE. He aquí un ejemplo:

http://jsfiddle.net/xeSQb/6/

Desafortunadamente Opera antes del cambio al motor de renderizado de parpadeo en la versión 15 no es compatible con cualquiera window.find o TextRange.Si esto es una preocupación para usted, una alternativa en lugar de peso pesado es el uso de una combinación de los TextRange y CSS class applier módulos de mi biblioteca Rangy, como en la siguiente demostración: http://rangy.googlecode.com/svn/trunk/demos/textrange.html

Código:

function doSearch(text) { 
    if (window.find && window.getSelection) { 
     document.designMode = "on"; 
     var sel = window.getSelection(); 
     sel.collapse(document.body, 0); 

     while (window.find(text)) { 
      document.execCommand("HiliteColor", false, "yellow"); 
      sel.collapseToEnd(); 
     } 
     document.designMode = "off"; 
    } else if (document.body.createTextRange) { 
     var textRange = document.body.createTextRange(); 
     while (textRange.findText(text)) { 
      textRange.execCommand("BackColor", false, "yellow"); 
      textRange.collapse(false); 
     } 
    } 
} 

Answer 2

Aquí hay 2 problemas. Uno es el problema de contenido anidado, o coincidencias de búsqueda que abarcan un límite de elemento. El otro es caracteres escapados de HTML.

Una forma de manejar los caracteres escapados de HTML es, si está utilizando jQuery por ejemplo, utilizar el método .text(), y ejecutar la búsqueda sobre eso. El texto que proviene de eso ya tiene a los personajes escapados "traducidos" en su personaje real.

Otra forma de manejar esos caracteres especiales sería reemplazar el carácter real (en la cadena de búsqueda) con la versión escapada. Dado que hay una gran variedad de posibilidades allí, sin embargo, podría ser una búsqueda larga dependiendo de la implementación.

Se puede usar el mismo tipo de método de "texto" para encontrar coincidencias de contenido que abarquen los límites de las entidades. Se vuelve más complicado porque el "Texto" no tiene ninguna noción de dónde provienen las partes reales del contenido, pero le da un dominio más pequeño para buscar si se explora. Una vez que está cerca, puede cambiar a un más tipo de búsqueda de "series de caracteres" en lugar de búsqueda basada en palabras.

No conozco ninguna biblioteca que haga esto sin embargo.

Answer 3

Simplemente pulse F3 y use el comando <p> y </p> para informar a otros en su sitio. Por ejemplo: Usted tiene el conocimiento del botón de búsqueda F3 de modo para poner el texto en la pantalla para decir a los demás que escribiría ..

<p><h4>If your having trouble finding something press F3 to highlight the text<h4></p>