A função de destaque refere -se principalmente a destacar o texto especificado na área especificada na página, ou seja, coloração em segundo plano. Esta função é geralmente usada nas páginas de resultados de pesquisa.
Aqui está uma solução para você implementá -lo usando JavaScript.
Primeiro, apresente o seguinte método JavaScript em <head>:
A cópia do código é a seguinte:
<script type = "text/javascript">
// <! [CDATA [
// -------- Comece a função fhl (o, bandeira, rndcolor, url) ------------------ ///
função fhl (o, sinalizador, rndcolor, url) {
/// <summary>
/// Use JavaScript HTML DOM para destacar palavras específicas da página.
/// Exemplo:
/// fhl (document.body, 'papel guarda -chuva | ela');
/// O corpo aqui se refere ao conteúdo no corpo destacado.
/// fhl (document.body, 'esperança | desculpe', false, '/');
/// fhl (document.getElementById ('at_main'), 'solar | flutuante | long', true, 'search.asp? Keyword =');
/// O 'at_main' aqui se refere ao conteúdo na div com ID destacado = 'at_main'. search.asp? Keyword = refere -se ao endereço de link adicionado à palavra -chave,
/// Eu adicionei um parâmetro aqui e será usado posteriormente. Pode ser qualquer endereço.
/// </summary>
/// <param name = "o" type = "objeto">
/// objeto, o objeto a ser destacado.
/// </param>
/// <param name = "flag" type = "string">
/// string, para destacar a palavra ou várias palavras, use barras verticais (|) para separar várias palavras.
/// </param>
/// <param name = "rndcolor" type = "boolean">
/// Valor booleano, exibindo aleatoriamente a cor do fundo do texto e a cor do texto, True significa exibição aleatória.
/// </param>
/// <param name = "url" type = "string">
/// URI, se deve adicionar links a palavras destacadas.
/// </param>
/// <lect Return> </rort>
var BGCOR = FGCOR = '';
if (rndcolor) {
bgcor = frndcor (10, 20);
fgcor = frndcor (230, 255);
} outro {
bgcor = '#f0f';
fgcor = 'preto';
}
var re = novo regexp (sinalizador, 'i');
for (var i = 0; i <o.childnodes.length; i ++) {
var o_ = O.ChildNodes [i];
var o_p = o_.parentNode;
if (O_.NODETYPE == 1) {
fhl (O_, sinalizador, rndcolor, url);
} else if (o_.nodeType == 3) {
if (! (o_p.nodename == 'a')) {
if (o_.data.search (re) ==-1) continuar;
var temp = FELEA (O_.Data, sinalizador);
O_P.Replacechild (temp, O_);
}
}
}
// --------------------------------------------------
função fElea (texto, sinalizador) {
var style = 'style = "cor de fundo:'+bgcor+'; cor:'+fgcor+';" '
var o = document.createElement ('span');
var str = '';
var re = novo regexp ('('+sinalizador+')', 'gi');
if (url) {
str = text.replace (re, '<a href = "'+url+
'$ 1 "'+style+'> $ 1 </a>'); // Aqui está um link para a palavra -chave, e o Red $ 1 refere -se aos parâmetros específicos após o endereço do link acima.
} outro {
str = text.replace (re, '<span'+style+'> $ 1 </span>'); // mostra quando não está vinculando
}
o.innerhtml = str;
retornar o;
}
// --------------------------------------------------
função frndcor (abaixo, mais) {
if (argumentos.Length == 1) {
var over = abaixo;
em = 0;
} else if (argumentos.length == 0) {
var abaixo = 0;
var over = 255;
}
var r = frandomby (abaixo, acima) .ToString (16);
r = padnum (r, r, 2);
var g = frandomby (abaixo, acima) .ToString (16);
g = padnum (G, G, 2);
var b = frandomby (abaixo, acima) .ToString (16);
b = padnum (b, b, 2);
// defaultStatus = r+''+g+''+b
retornar '#'+r+g+b;
função frandomby (abaixo, mais) {
switch (argumentos.length) {
Caso 1: Retorne parseint (Math.Random ()*em+1);
Caso 2: Retorne parseint (Math.Random ()*(Over-under + 1) + abaixo);
Padrão: retornar 0;
}
}
função padnum (str, num, len) {
var temp = ''
for (var i = 0; i <len; temp+= num, i ++);
retorno temp = (temp+= str) .substr (temp.length-len);
}
}
}
// -------- Função final FHL (O, Flag, RndColor, URL) -------------------- ///
//]]>
</script>
O método FHL acima é usado para obter destaque e o significado dos parâmetros é escrito nos comentários.
Em seguida, ligue para o método FHL no final da página para destacar o texto da área especificada, por exemplo:
A cópia do código é a seguinte:
<script type = "text/javascript">
fhl (document.body, 'destaque'); // colorir o fundo do texto "Destaque" na área do corpo da página
</script>
Que tal isso, é muito simples ~