JavaScript melaksanakan fungsi penyerlahan kata kunci_Pengetahuan asas

Fungsi penyerlahan terutamanya merujuk kepada menyerlahkan teks yang ditentukan dalam kawasan yang ditentukan pada halaman, iaitu, pewarnaan latar belakang. Secara amnya, fungsi ini sering digunakan pada halaman hasil carian.

Berikut ialah penyelesaian untuk semua orang, dilaksanakan dalam javascript.

Mula-mula perkenalkan kaedah javascript berikut dalam :

Salin kod Kod adalah seperti berikut: // //--------mulakan fungsi fHl(o, bendera, rndColor, url)-----------------// Fungsi fHl(o, bendera, rndColor, url){ /// /// Gunakan DOM HTML javascript untuk menyerlahkan perkataan tertentu pada halaman. /// 🎜> Badan di sini merujuk kepada kandungan di dalam badan yang diserlahkan. fHl(document.getElementById('at_main'), 'Alone | Terapung | Long', true, 'search.asp?keyword='); /// . search.asp?keyword= merujuk kepada alamat pautan yang ditambahkan pada kata kunci, Saya menambahkan parameter di sini, yang akan digunakan kemudian. Boleh jadi mana-mana alamat. /// /// /// Objek, objek yang akan diserlahkan /// /// Rentetan, perkataan atau berbilang perkataan untuk diserlahkan, gunakan bar menegak (|) untuk memisahkan berbilang perkataan /// /// Nilai boolean, sama ada untuk memaparkan secara rawak warna latar belakang dan warna teks secara rawak /// /// /// URI, sama ada untuk menambah pautan pada perkataan yang diserlahkan>. /// var bgCor=fgCor=''; Jika(rndColor){ bgCor=fRndCor(10, 20); fgCor=fRndCor(230, 255); } lain { bgCor='#F0F'; fgCor='hitam'; } var re=new RegExp(bendera, 'i'); for(var i=0; i var o_=o.childNodes[i]; var o_p=o_.parentNode; Jika(o_.nodeType==1) { fHl(o_, bendera, rndColor, url); } jika tidak (o_.nodeType==3) { Jika(!(o_p.nodeName=='A')){ Jika(o_.data.search(re)==-1)teruskan; var temp=fEleA(o_.data, bendera); o_p.replaceChild(temp, o_); } } //------------------------------------------------ fungsi fEleA(teks, bendera){ var style=' style="background-color:' bgCor ';color:' fgCor ';" ' var o=document.createElement('span'); var str=''; var re=new RegExp('(' flag ')', 'gi'); Jika(url){ str=text.replace(re, ' Gaya '$1"' '>$1 '); //Ini adalah untuk menambah pautan kepada kata kunci. $1 merah merujuk kepada parameter khusus selepas alamat pautan di atas. } lain { str=text.replace(re, ' $1 '); // Paparkan apabila tiada pautan ditambahkan } o.innerHTML=str; kembali o; } //------------------------------------------------ fungsi fRndCor(bawah, atas){ If(arguments.length==1){ var over=under; di bawah = } else if(arguments.length==0){ var di bawah=0; var over=255; } var r=fRandomBy(under, over).toString(16); r=padNombor(r, r, 2); var g=fRandomBy(under, over).toString(16); g=padNum(g, g, 2); var b=fRandomBy(under, over).toString(16); b=padNombor(b, b, 2); //defaultStatus=r ' ' g ' ' b kembalikan '#' r g b; fungsi fRandomBy(bawah, atas){ suis(arguments.length){ kes 1: kembalikan parseInt(Math.random()*di bawah 1); kes 2: kembalikan parseInt(Math.random()*(lebih-bawah 1) di bawah lalai: pulangkan 0; } fungsi padNum(str, num, len){ var temp='' untuk(var i=0; i } } //--------fungsi akhir fHl(o, bendera, rndColor, url)--------------------------// //]]>

Kaedah fHl di atas digunakan untuk mencapai penyerlahan, dan maksud parameter ditulis dalam ulasan. Kemudian panggil kaedah fHl di hujung halaman untuk menyerlahkan teks yang ditentukan dalam kawasan yang ditentukan, contohnya:

Salin kod Kod adalah seperti berikut: fHl(document.body, 'highlight'); // Warnakan latar belakang teks "diserlahkan" dalam kawasan kandungan halaman

Bagaimana pula, ia sangat mudah~