La función de resaltado se refiere principalmente a resaltar el texto especificado en el área especificada en la página, es decir, coloración de fondo. Esta función generalmente se usa en las páginas de resultados de búsqueda.
Aquí hay una solución para que lo implemente usando JavaScript.
Primero, introduzca el siguiente método de JavaScript en <Evista>:
La copia del código es la siguiente:
<script type = "text/javaScript">
// <! [Cdata [
// -------
función fhl (o, flag, rndcolor, url) {
/// <summary>
/// Use JavaScript HTML DOM para resaltar las palabras específicas de la página.
/// Ejemplo:
/// fhl (document.body, 'Paper Umbrella | She');
/// El cuerpo aquí se refiere al contenido en el cuerpo resaltado.
/// fhl (document.body, 'esperanza | lo siento', falso, '/');
/// fhl (document.getElementById ('at_main'), 'solar | flotante | long', true, 'search.asp? Walkword =');
/// El 'At_main' aquí se refiere al contenido en el DIV con ID resaltado = 'AT_Main'. Search.asp? Palabra clave = se refiere a la dirección de enlace agregada a la palabra clave,
/// He agregado un parámetro aquí y se usaré más tarde. Puede ser cualquier dirección.
/// </summary>
/// <param name = "o" type = "object">
/// Objeto, el objeto se resaltará.
/// </param>
/// <param name = "flag" type = "string">
/// cadena, para resaltar la palabra o múltiples palabras, use barras verticales (|) para separar varias palabras.
/// </param>
/// <param name = "rndcolor" type = "boolean">
/// valor booleano, ya sea para mostrar aleatoriamente el color de fondo de texto y el color de texto, verdadero significa visualización aleatoria.
/// </param>
/// <param name = "url" type = "string">
/// Uri, si agregar enlaces a las palabras resaltadas.
/// </param>
/// <s return> </return>
var bgcor = fgcor = '';
if (rndcolor) {
bgcor = frndcor (10, 20);
fgcor = frndcor (230, 255);
} demás {
bgcor = '#f0f';
fgcor = 'negro';
}
var re = new Regexp (Flag, 'I');
para (var i = 0; i <o.childnodes.length; i ++) {
var o_ = o.childnodes [i];
var o_p = o_.parentnode;
if (o_.nodeType == 1) {
fhl (o_, bandera, rndcolor, url);
} else if (o_.nodeType == 3) {
if (! (o_p.nodename == 'a')) {
if (o_.data.search (re) ==-1) continuar;
var temp = Felea (o_.data, bandera);
o_p.replaceChild (temp, o_);
}
}
}
// ------------------------------------------------
función Felea (texto, bandera) {
var style = 'style = "Background-Color:'+bgcor+'; color:'+fgcor+';" '
var o = document.createElement ('span');
var str = '';
var re = new Regexp ('('+flag+')', 'gi');
if (url) {
str = text.replace (re, '<a href = "'+url+
'$ 1 "'+estilo+'> $ 1 </a>'); // Aquí hay un enlace a la palabra clave, y el rojo $ 1 se refiere a los parámetros específicos después de la dirección de enlace anterior.
} demás {
str = text.replace (re, '<span'+style+'> $ 1 </span>'); // Mostrar cuando no se vincula
}
o.innerhtml = str;
regreso o;
}
// ------------------------------------------------
función frndcor (debajo, over) {
if (arguments.length == 1) {
var over = debajo;
bajo = 0;
} else if (arguments.length == 0) {
var debajo = 0;
var más = 255;
}
var r = frandomby (debajo, sobre) .tostring (16);
r = padnum (r, r, 2);
var g = frandomby (debajo, sobre) .tostring (16);
g = Padnum (G, G, 2);
var b = frandomby (debajo, sobre) .tostring (16);
b = padnum (b, b, 2);
// defaultStatus = r+''+g+''+b
return '#'+r+g+b;
función frandomby (debajo, over) {
switch (argumentos.length) {
Caso 1: return parseint (math.random ()*bajo+1);
Caso 2: return parseInt (math.random ()*(over-under + 1) + debajo);
predeterminado: devolver 0;
}
}
función padnum (str, num, len) {
var temp = ''
para (var i = 0; i <len; temp+= num, i ++);
return temp = (temp+= str) .substr (temp.length-len);
}
}
}
// -------- Función final FHL (O, Flag, RNDColor, URL) -------------------- //
//]]>
</script>
El método FHL anterior se utiliza para lograr el resaltado, y el significado de los parámetros se escribe en los comentarios.
Luego llame al método FHL al final de la página para resaltar el texto para el área especificada, por ejemplo:
La copia del código es la siguiente:
<script type = "text/javaScript">
fhl (document.body, 'resaltar'); // Colorear el fondo del texto "resaltar" en el área del cuerpo de la página
</script>
¿Qué tal, es muy simple ~