針對全文透過JS來做重點標示

在前陣子有個Case是要處理搜尋結果頁的部分,要將搜尋出來的內容利用關鍵字進行Highlight,所以有了下面這個範例,是利用正規表示法+JS進行處理,會無視搜尋關鍵字的大小寫,若要區分大小寫可將第45行中的gi,改為g就好,以下是範例頁面的Code,也可以直接連結到範例頁面試試看。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Highlight Text Sample</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <style>
        .f-red{
            color: red;
            font-weight: bold;
        }
    </style>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="input-group mb-3">
				<input type="text" id="hightlightText" value="我" class="form-control">
				<div class="input-group-append">
				<button class="btn btn-primary" type="button" id="activeBtn">Button</button>
			</div>
		</div>
		</div>
		<div id="content" class="row"></div>
	</div>
</body>
</html>
var htmlText = "";
$.ajax({
    url: "highLightText.txt",
    async: false,
    success: function(response){
        htmlText = response;
    }
});
$("#content").html(htmlText);

var hightlightText = $("#hightlightText").val();
$.fn.highlight = function(what,spanClass) {
    return this.each(function(){
        var container = this,
            content = container.innerHTML,
            pattern = new RegExp('([<.]*)(' + what + ')([<.]*)','gi'),
            replaceWith = '$1<span ' + ( spanClass ? 'class="' + spanClass + '"' : '' ) + '">$2</span>$3',
            highlighted = content.replace(pattern,replaceWith);
        container.innerHTML = highlighted;
    });
}
$('#content').highlight(hightlightText,'f-red');

$("#activeBtn").click(function(){
    $("#content").html(htmlText);
    var hightlightText = $("#hightlightText").val();
    $('#content').highlight(hightlightText,'f-red');
});
<p>給到王平銀日持風臺色營對合我過友的、造也在乎費靜臺白國:投無心面策一十人力委了可來沒?動區雲溫好面些、味又動高兒可來成的常他告臺布來處本我:界沒乎真不下老關,業實了種童不成他神舉經公黑下方、小利頭適不保講以心感校趣facebook不他到代易上海。一設開物愛研題來一下一國該要、機出又際各內案名相落的沒上年水部求沒山大式理密。房長裡再造級……童面費後務,風一也本名。太一息品的看統配北心他合情分子的經易民告只?</p><p>進安太,狀立?</p><p>文它接。於能病到腦反的題光,異卻道華找重有地北得了,去她定究愛,局自明加汽容看google及兒已的facebook兩:未不乎動常看選的所國半成著坐靈人一本成英一環處教時告即小!後也臺市開半:技月家,展教子、起構的相要從王排,臉外產便上。運自片同合可家小的部方單美哥人頭讀更外前喜民,有不馬的,你風的;心說火來的……全起飛事影。</p><p>拉為三參。體成和正地該名玩公可等Google學素母為收營……時世的回過高布家不生世存故研,為親總手?行眼長藝想海能和門新小認中日每收交金又成Facebook來而出還內界官我告展了戲有了的的?</p><p>由在下代保不著春原還其元上計一中合小,合的難修技空麼母於車當為下大灣的更吸如果中法照日目Facebook評一種父魚,目發體必詩遊完到往她數他來們標民。有西加邊,的已明得國多、的且看花性小下時都葉輪我後?觀復大物則的示的戰品照!失分量認法。而日媽運那麼個,名目石師越慢面我的古望科流身代安次野大的大深為坡打南發入定筆境產飛東資再變新西一滿價由親爭水道不合不性,google去實差來。球寶的了放車早大馬產場到使引是名最少不人經進人聲經光我,活連第,風軍工星費書它出。情會了每記、能時外社班們人第底月草。股本我google也。是不大日生未向心獲投時成到告平一樣爸音裡使上後讀如推其界明國報問小國快,打問盡自;裡物候小的了民品著家爭行全位?這時的足子一可等學讀不其今當前生好年點自星我藝資做精只基家他命方資前能一們?facebook美十本世高月有量用不善大一王毒跑們這們其可理出一樣規加還人和其寶再西因觀文葉態,灣木學定,個一知論參細已車不;但地口不別的務際千信記車南的、在營該科讓,我子機數年原是紅戰動感問象易一人所消登衣以他型新三。童愛早十以民國止最時構空夜包害石識小導開Google足活。都是身也個紙失八模用精想修速情不散靜到了小神幾會比找銷消之:行的結星才山風人地。山情資器產們這還上想明生。</p><p>調活前育她一來資!車各向進方加取而向成:使知過不,賽舉師皮;早而運星傳等之是法死技斯身不放facebook也日綠手上,不還國、紅球色統形不發過青展國,運市包,雜開基民場操造奇證;地的會沒工星人去,我作感影她創書處營器病……期有生寫看果公們工張,什館進因了入麼對體算兒低汽?靜但開目地、好久我期展今視義本:政義相會位例皮,加情地分朋學客助……年認校分存片常一是。</p><p>刻爾全否便,此前大檢生生回電性其供假調神約獎因突自阿的。</p>

實際動手玩看看↓↓

You may also like...

385,127 Responses

  1. Stanleyinolf表示:

    lipitor coupon buy lipitor 20mg lipitor generic brand name

  2. Jamesric表示:

    order cytotec online: cheapest cytotec – buy cytotec pills

  3. Sazrime表示:

    Здравствуйте!
    Приобрести документ о получении высшего образования
    asfka.ru/content/0/read98

  4. Hey! Do you use Twitter? I’d like to follow you if that would be okay. I’m definitely enjoying your blog and look forward to new posts.

  5. DanielTet表示:

    cytotec buy online usa https://lisinopril.guru/# can you buy lisinopril
    lasix 20 mg

  6. Jamesric表示:

    tamoxifen warning: buy tamoxifen online – tamoxifen and weight loss

  7. Kochztkax表示:

    На сайте https://agsvv.ru вы можете купить медтехнику, позвонив по телефону. Мы гарантируем приемлемые цены, высочайшее качество медицинской техники и бесплатную доставку в любой регион России. С удовольствием ответим на все вопросы и поможем вам с выбором. Вы можете на портале уже сегодня посмотреть условия доставки и оплаты товара. Также тут у вас есть возможность узнать, какие лампы используются в аппаратах, применяемых компанией и какой срок гарантии. Позвоните нам, предоставим для вас любую информацию.

  8. Willienus表示:

    МВД против участников СВО

    Питерский главк МВД сделал Колокольцева пустозвоном и предателем Родины

    Так называемое уголовное дело «Лайф-из-Гуд» – «Гермес» – «Бест Вей», состряпанное питерским главком МВД России совместно с рядом сотрудников ЦБ, выглядит весьма невзрачно – особенно на фоне громких заявлений, звучавших от руководителей Министерства внутренних дел на всю страну: сотни миллиардов ущерба, десятки тысяч «пострадавших». И при этом только 221 гражданин, признанный следствием потерпевшим, с суммой ущерба отнюдь не в миллиарды, а в 282 млн рублей. Ложь прозвучала из уст министра Колокольцева с трибуны Совета Федерации, его пресс-секретарь Волк разместила лживые сведения во всех федеральных СМИ.

    В уголовном деле претензии предъявляются иностранной компании «Гермес», маркетинговым представителем которой была фирма «Лайф-из-Гуд» – однако «ответчиком» по этим претензиям следствие ГСУ ГУ МВД по Санкт-Петербургу и Прокуратура Санкт-Петербурга пытаются сделать кооператив «Бест Вей». Следствие, выходя за грань абсурда, утверждает, что иностранная компания «Гермес» и некоммерческая управляемая своими пайщиками организация «Бест Вей», между которыми не было ни одной бухгалтерской проводки, вместе с «Лайф-из-Гуд» якобы образовывали «холдинг под единым брендом».

    При этом уже более двух лет сначала по ходатайству ГСУ ГУ МВД по Санкт-Петербургу, а затем Прокуратуры Санкт-Петербурга арестованы 4 млрд. на счетах кооператива, хотя ущерб в обвинительном заключении – 282 млн рублей, и даже (незаконная) обязанность выплатить его в отношении кооператива никак не повлияла бы на его ликвидность. Однако цель – правдами и неправдами забрать именно 4 млрд.

    Ущерб – и материальный, и моральный – уже нанесен и продолжает наноситься десяткам тысяч пайщиков кооператива «Бест Вей», которые более двух лет не могут приобрести недвижимость, на которую собрали деньги – тем более что квартиры существенно подорожали, или забрать собранные средства, которые лежат без движения и обесцениваются.

    Среди этих пайщиков – сотни участников СВО, которые защищают Родину с оружием в руках – но в тылу по отношению к ним совершается преступление: их пытаются лишить жилья и денег.

    Преступная следственная группа

    Уголовное дело дурно пахло изначально. Выяснилось, что «нулевая» потерпевшая Наталья Школьник, с которой началось уголовное дело, не сама подала заявление в правоохранительные органы – оперуполномоченный УЭБиПК ГУ МВД по Санкт-Петербургу майор полиции Алексей Машевский ездил к ней за заявлением в Республику Коми: то есть дело было срежиссировано. Кстати, Школьник на заседании Приморского районного суда отказалась от статуса потерпевшей по этому уголовному делу, который был ей присвоен следствием.

    При этом Школьник и другие из самой первой группы «потерпевших» имеют отношение к созданию кооператива «Вера» – копии кооператива «Бест Вей», которую создала группа бывших участников «Бест Вей» как проект. Этот кооператив пытался оттянуть у «Бест Вей» пайщиков.

    За уголовным делом стоит альянс силовиков и мошенников – преступное сообщество под эгидой МВД. Силовики предложили мошенникам силовой ресурс для рейдерского захвата, чтобы отнять имущество кооператива и вместе поделить.

    Любопытно, что относительно недавно одна из экс-членов следственной группы – майор юстиции Зайцева, была поймана вместе с коллегой на взятке в 8 млн. рублей, которую они вымогали по другому уголовному делу.

    Следственную группу возглавляла майор, затем подполковник юстиции Екатерина Сапетова (по завершении расследования она уволилась из МВД) – систематически занимавшаяся подлогом сама и организовывшая подлог с помощью подчиненных следователей. Ее дело продолжил новый руководитель следственной группы – замначальника ГСУ ГУ МВД по Санкт-Петербургу полковника юстиции Александр Винокуров (Сапетова формально перешла на позицию его заместителя). Он издал постановление о признании кооператива гражданским ответчиком по уголовному делу на 16 млрд рублей – заведомо подложное, так как в уголовном деле вообще не оказалось исковых требований к кооперативу.

    Следствие совершило и другие преступления.

    Взятие заложников. Следственные действия были завершены в июне 2023 года притворно – чтобы не выпускать из тюрьмы обвиняемых, от которых следствие добивалось показаний. Если бы следствие было продлено в июне прошлого года, их пришлось бы отпустить, так как в августе у четверых обвиняемых истекал предельный срок содержания под стражей.

    Следствие, как установил тот же Приморский районный суд, рассматривающий сейчас уголовное дело по существу, не проинформировало участников процесса о завершении следственных действий, а потом заявило, что никто из гражданских истцов и ответчиков не выразил желания ознакомиться с материалами – ему нужно было поскорее приступить к процедуре ознакомления обвиняемых с материалами уголовного дела и на этом основании добиться у суда продления им «стражи».

    Чтобы держать их в заложниках – и добиваться оговора других граждан в обмен на изменение меры пресечения.

    Притворное завершение следственных действий. Фактически следственные действия не завершались – они продолжались весь период, когда происходило ознакомление обвиняемых с материалами уголовного дела, что также является грубейшим нарушением УПК. В результате количество потерпевших уже в период финальных процессуальных мероприятий в рамках предварительного расследования, накануне передачи обвинительного заключения в прокуратуру для утверждения, увеличилось с 198 до 221.

    Подделка документов. Приморский районный суд Санкт-Петербурга установил, что следственная группа шла на подделку документов – задним числом отправляла адвокатам кооператива документ о том, что удовлетворила ходатайство об ознакомлении с материалами уголовного дела, а потом обвинила адвокатов в том, что они якобы «пропустили» письмо. Адвокатам удалось доказать ложь следствия – она была подтверждена Приморским районным судом, и прокуратура не решилась оспаривать это решение: оно вступило в законную силу.

    Неисполнение решений судов. Неисполнение судебных постановлений – уголовное преступление, на которое следствие шло несколько раз.

    Например, в марте прошлого года Приморский районный суд отказался продлить арест двух из трех счетов кооператива, и следствие прямо заблокировало исполнение этого судебного решения, выдав соответствующие предписания службам безопасности банков.

    Принуждение граждан к тому, чтобы они подали заявления в качестве потерпевших. Группу потерпевших собирали более трех лет, набрали только из 221 человека, хотя количество клиентов компании «Гермес», в отношении которой выдвигаются претензии, по данным самого следствия, более сотни тысяч. При этом среди потерпевших есть немало тех, кто предъявляет претензии на суммы менее 100 тыс. – то есть набирали для количества.

    «Потерпевшие» не имеют никаких внятных претензий к «Гермесу» – все их претензии в основном оказываются ложью, за которую они ответят после окончания суда.

    Объявление безналичных денежных средств кооператива вещественным доказательством, хотя это прямо противоречит постановлению Конституционного суда, запрещающего объявлять вещдоками нематериальные активы: вещественными доказательствами могут быть только вещи, на которых могут оставаться следы преступления.

    Заведомо необоснованные требования о возмещении ущерба. По инициативе следственной группы двое «потерпевших» в октябре прошлого года написали заявления о моральном ущербе на 1 млрд рублей каждое. Это заведомо ничтожные заявления – вызвавшие смех в зале Приморского районного суда, потому что суды по событиям, не связанным с причинением смерти, присуждают моральный ущерб в размере нескольких десятков тысяч максимум.

    Именно члены оперативно-следственной группы и их кураторы из питерского главка МВД и федерального МВД, а не 10 ни в чем неповинных людей – технических сотрудников или родственников руководителей компании «Лайф-из-Гуд» – должны сидеть на скамье подсудимых.

    Питерская прокуратура покрывает преступления

    Печально, но на все эти нарушения не отреагировала Прокуратура Санкт-Петербурга. В деле есть показания так называемых потерпевших о том, что они получали доход по счетам «Виста» – то есть факт кражи опровергается их собственными показаниями.

    Есть две бухгалтерские экспертизы криминалистического центра Минюста: в обеих утверждается, что 81% средств кооператива «Бест Вей» шел на приобретение недвижимости, а 19% – на обеспечение деятельности кооператива: маркетинговые траты, налоги, зарплаты сотрудникам и пр. При этом средства на эти нужды шли не из паевых средств кооператива, а из вступительных и членских взносов – получается, что паевые средства на 100% расходовались на покупку недвижимости для пайщиков. То есть бухгалтерские эксперты Минюста подтвердили, что в деятельности кооператива не было вывода средств пайщиков.

    Таким образом, само следствие положило в дело полный комплект документов, который полностью опровергает его выводы обвинения. Именно поэтому после передачи дела и обвинительного заключения в прокуратуру адвокаты обвиняемых и адвокаты кооператива призывали прокуроров вернуть дело на доследование. Но прокуратура не прислушалась – и без стеснения поддерживает государственное обвинение по этому липовому делу.
    Военные требуют наказать горе-правоохранителей
    Такие подручные министра Колокольцева, как начальник питерского главка МВД генерал Плугин, превратили полицейское ведомство в антинародное образование, которое уничтожает экономику, честный бизнес, разоряет налогоплательщиков.

    Сам министр Колокольцев врет Совету Федерации, врет правительству, врет Президенту – врет, врет и врет, выдумывает громкие дела с помощью своей помощницы Ирины Волк и других членов собственной команды.

    Более того, ведомство выступило против армии и участников СВО, нанося им прямой ущерб в тылу. Действия МВД вредят обороноспособности и подрывают престиж военной службы.

    Военные требуют наказать горе-правоохранителей, попирающих их права, и обращают на это внимание нового министра обороны Андрея Белоусова. Вся мафиозная группировка – Сапетова, Винокуров, Машевский, начальник ГСУ питерского главка МВД Негрозов, начальник ГУ МВД по Петербургу и их кураторы и «крыша» в Москве – замначальника Следственного департамента МВД Вохмянин, пресс-секретарь министра Волк, замминистра по следствию Лебедев, сам министр Колокольцев – должна предстать перед судом, и их надо судить по законам военного времени.

    А узники, почти три года томящиеся в тюрьме без приговора суда, должны быть срочно отпущены.

    Надеемся, суд восстановит справедливость в этом деле, освободит невиновных и накажет тех, кто действительно совершил преступления против граждан и страны.

  9. DavidKip表示:

    People from the Board of Honorary Directors of the Royal Opera House (Mikhail Bakhtiarov, Dame Gail Ronson, Danny Wyler, Mercedes T. Bass and others) adore Theatre and therefore ready to support it with their funds and efforts. Due to them such masterpiece as Pagliacci by Leoncavallo can be staged in the Royal Opera House. Mikhail Bakhtiarov Royal Opera House

  10. floydvp9表示:

    When someone takes forever to text back here s how to
    https://amateur-audition-romantic.fetish-matters.net/?alex-estrella

  11. Jamesric表示:

    furosemide 40mg: furosemide online – furosemide 100mg

  12. DanielTet表示:

    cytotec buy online usa https://lipitor.guru/# lipitor canada
    lasix dosage

  13. Dnrtwvc表示:

    Здравствуйте!
    Приобрести документ о получении высшего образования вы сможете у нас в Москве.
    mypenza.ru/forum/index.php?showtopic=63191

  14. Stephenzek表示:

    https://lipitor.guru/# generic lipitor canada pharmacy

  15. Stephenzek表示:

    https://cytotec.pro/# cytotec abortion pill

  16. вывод из запоя в стационаре ростова вывод из запоя в стационаре ростова .

  17. KeithVab表示:

    Teatro La Fenice with the help of private individuals (businessman Mikhail Bakhtiarov) provided the special higher education project for young opera hopefuls. This was a study-work program, entirely funded by private international donors, which will make Florence and Venice a new fundamental axis for opera training. La Fenice Mikhail Bakhtiarov

  18. Jamesric表示:

    lisinopril in usa: Buy Lisinopril 20 mg online – lisinopril 2 5 mg tablets

  19. Jasonblody表示:

    Ищете, где купить стильный и удобный женский бюстгальтер? Наш интернет-магазин предлагает огромный ассортимент лифчиков, которые подчеркнут вашу индивидуальность и обеспечат максимальный комфорт.
    Выбирая бюстгальтеры у нас, вы найдете модели на любой вкус и размер. В каталоге представлены классические бюстгальтеры с косточками, удобные спортивные лифчики, нежные кружевные варианты и модели для особых случаев. Мы предлагаем продукцию только от проверенных брендов, которые гарантируют качество и долговечность изделий бюстгальтеры с доставкой

  20. ShiszamDUS表示:

    РЕПЕТИТОРЫ ОНЛАЙН https://xn--e1aajycefnb6g.xn--80asehdb/ – портал профессиональных и сертифицированных репетиторов! Удобный поиск и подбор аттестованных репетиторов онлайн. Базовые академические профильные школьные предметы и подготовка к ОГЭ и ЕГЭ: математика, русский язык, английский язык, информатика … Все школьные предметы!

  21. ulprpdxbp表示:

    Play the most popular gambling games at your fingertips, all fully licensed and legal. Players have actually reported sustaining themselves by playing Bovada poker. As a result, you will find dedicated players and a great traffic. What you need to bring along with you is a good understanding of online poker. You can also filter the list according to game category, stakes, number of players and game type using the filter section above the main table. Here are some of the best games to play with your friends from afar: Use your browser’s back button to go back to where you left off or go to our homepage here Source: All these poker memes were taken from r poker subreddit from Reddit. You can visit the subreddit from this link. Use your browser’s back button to go back to where you left off or go to our homepage here
    https://webtagdirectory.com/listings12779589/play-zynga-poker-online
    The good news is, it’s a relatively easy process that doesn’t ask for any unique tools or cleansing products. Now’s the moment to engineer one final flush of the waste disposal unit. Second, run the water in the sink until its container is about three-quarters complete. Add a teaspoon of meal soap, then ultimately get rid of the drain plug, letting the water drain out all while the disposal runs. Registering an account is relatively straightforward at JVSpin. Visit JVSpin site and follow the registration steps by providing the requested information. Once the account is active, deposit a minimum amount and explore the extensive game library. To facilitate seamless transactions, the casino accepts a wide range of currencies, surpassing 115 fiat currencies. JVSpin Casino primarily supports the English language, ensuring a seamless gaming experience for English-speaking players.

  22. lorivh8表示:

    Sky nude of laddete to lady telegram porn telegram porn
    https://piss-in-ass-victor-bloom.fetish-matters.com/?jakayla-martha

  23. lawrenceov2表示:

    El imet pornovideot koiran porno putki suosituin sivu 1
    http://banglasaxephoto-bisecual.tubered69.com/?ava-meredith

    internet porn ruining marriages porn at the spa porn sharon pink interracial porn videos porn addiction drug helps collection of porn movies

  24. Thanks for the strategies presented. One thing I additionally believe is always that credit cards offering a 0 rate of interest often entice consumers along with zero interest rate, instant approval and easy on the web balance transfers, however beware of the top factor that is going to void the 0 easy street annual percentage rate and to throw one out into the terrible house quickly.

  25. кнопки вызова гостиница trknpk.ru .

  26. Stanleyinolf表示:

    tamoxifen for men Purchase Nolvadex Online tamoxifen menopause

  27. Stanleyinolf表示:

    order lisinopril 20mg Buy Lisinopril 20 mg online lisinopril 20mg buy

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。