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


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 están 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 la segunda.


Ejemplo b:

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

La búsqueda de "lápices" o "lapices" no produciría un resultado.


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

¡Gracias por adelantado!

Bruno


14
2018-05-04 16:43


origen


Respuestas:


Puedes usar window.find() en navegadores no IE y TextRangees findText() método en IE. Aquí hay un ejemplo:

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

Desafortunadamente, Opera antes del cambio al motor de renderizado Blink en la versión 15 no admite ninguno window.find o TextRange. Si esto es una preocupación para usted, una alternativa bastante pesada es usar una combinación de TextRange y Aplicador de clase CSS módulos de mi Alto y delgado biblioteca, 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);
        }
    }
}

32
2018-05-04 17:53



Hay 2 problemas aquí. 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 con escape de HTML es, si está utilizando jQuery, por ejemplo, usar el .text() método, y ejecutar la búsqueda en 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 personaje 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.

El mismo tipo de método de "texto" se puede usar 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.


0
2018-05-04 17:03



Simplemente presiona F3 y usa el <p>  y </p> comando para decirle a otros en su sitio. Por ejemplo: usted tiene el conocimiento del botón de búsqueda F3 para poner texto en la pantalla y decirles a los demás que escribiría.

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

-2
2018-02-17 02:22