Home > Developer > JavaScript
keyword Highlighting presumably everyone is not unfamiliar with it, the application is also more extensive, the following for you to introduce the next through JavaScript is how to achieve the page keyword highlighting
The code is as follows: <! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <html xmlns=" http://www.w3.org/1999/xhtml "> <head> <meta http-equiv=" Content-type "content=" text/html;charset=utf-8/> <title> keyword highlighting </title> </head> <body> <div class= "result" id= "textbox" > <p> Baidu (Nasdaq Abbreviation: BIDU) is the world's largest Chinese search engine, Founded in January 2000 by Robin Li and Xu, Beijing Zhongguancun is dedicated to providing people with "simple, reliable" </p> <p> information access. "Baidu" two words from the Chinese Song Dynasty ci Xin Qiji's "Green Jade case" Yuan Xi "the words" the crowd seeks him thousand degrees ", symbolizes the Baidu to Chinese information retrieval technology's persistent pursuit. </p> </div> <script> Function Highlight (idval, keyword) { var textbox = document.getElementById (Idval); if ("" = keyword) return; //Get all text content var temp = textbox.innerhtml;& nbsp Console.log (temp); var htmlreg = new RegExp ("<.*?>", "I"); var arr = new Array (); //Replace HTML superscript Sign for (var i = 0; true; i++) { //Matching HTML tags var tag = htmlreg.exec (temp); if (tag) { arr[i] = tag; } else { break; }  ; temp = Temp.replace (Tag, "{[(+ i +]]}"); } //Speaking keywords split into array words = decodeURIComponent (ke Yword.replace (/,/g, ")". Split (/s+/); //Replace keywords for (w = 0; w < words.length; w++) { //Match keywords, protect Special characters that can appear in keywords var r = new RegExp ("(" + Words[w].replace (/[() {}.+*?^$|[)] /g, "$&") + ")", "IG"); temp = Temp.replace (r, <b style= ' color:red; >$1</b> "); } //Redo HTML tags for (var i = 0; i < arr.length i++) { temp = Temp.repl Ace ("{[+ i +"]} ", Arr[i]); } textbox.innerhtml = temp; } Highlight (" TextBox "," Baidu, Robin Li ");   ; </script> </body> </html> Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
