Shulou(Shulou.com)06/02 Report--

Editor to share with you how the JavaScript regular method replace to achieve search keywords highlighting, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

Preface

Regular expressions are powerful tools in string processing tools. Some people think that this is just a small toy, but in any case can not be separated from it.

What is introduced here is the replace method of JavaScript's regular expression and the function of highlighting search keywords.

First introduce the replace method of regular expression

Replace introduction

Introduction to w3school original text link

How regular expressions use the special character $to represent the original text is the key to search highlighting.

Var str = "asad sad 123 sd qwe21"; str.replace (/\ d+/img, "number"); / / the number is correctly matched here and replaced with the Chinese number console.log (str) / "asad sad digits sd qwe digits"-- / / take a look at how to use $1 to represent the captured string var str = "asad sad 123 sd qwe21"; str.replace (/\ d+/img, "digits $1 digits"); console.log (str) / / "asad sad number $1 number sd qwe number $1 number" / / obviously did not succeed, $1 or $1, so how to use it correctly?-var str = "asad sad 123 sd qwe21"; str.replace (/ (\ d +) / img, "number $1 number") / / here we correctly match the numbers and use $1 to represent the original string and replace console.log (str); / / "asad sad digits 123digits sd qwe digits 21 digits" / * () represents a captive tuple in the rule, and the content to be replaced can be represented by a $1 special character. There can be multiple () tuples, that is, there can be more than one $1.

Start to try your skills.

B {color:red;} Spring River Flower Moon Night

Author: Zhang Ruoxu

The tide of the Chunjiang River is even with the sea, and the bright moon on the sea is full of tide.

Where there is no moon in the spring river, there is no moon in the spring river.

Jiangliuwan turns around Fangdian, and the moon shines on the flower forest like graupel

The frost in the air could not be seen, and the white sand could not be seen.

There is no fine dust in the river and sky, and there is a lonely moon wheel in the sky.

Who by the riverside did fist see the moon rise? When did the moon first see a man by riverside?

Life has been endless for generations, and the river and moon are only similar year after year.

/ / input enter the string input.onchange = function () {/ / get the string to find var searchVal = input.value; / / get the content var text = poetry [XSS _ clean]; / / unhighlight the string highlighted by the previous lookup, text = text.replace (/] * > ([^ >] *) * > / ig, "$1"); poetry [XSS _ clean] = text / / initialize the regular expression and add parentheses () to form a capturable tuple. Ig represents global matching and case-insensitive var reg = new RegExp ("(" + searchVal + ")", "ig"); / / highlight the string text = text.replace (reg, "$1"); poetry [XSS _ clean] = text } above is all the content of the article "how to highlight search keywords by JavaScript regular method replace". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.