테스트 사이트 - 개발 중인 베타 버전입니다

웹페이지 검색어 마킹

· 3년 전 · 2893 · 2

   자바스크립트 이용 웹페이지의 검색어를 노란색으로 마킹합니다.

 

     <form id="f1" name="f1" action="javascript:void()">

        <input type="text" id="t1" name="t1" size=20 style="width:150px; font-size:20px; border:1px solid #eee;">

        <input type="button" value="검색" id="search_btn" style="font-size:16px; border:1px solid #eee; background-color:pink; padding:5px; color:white; border-radius:5px; cursor:pointer;">

      </from>

 

<script>

    var k;

    var temp;

    $(document).ready(function() {

      $('#search_btn').on('click',function(){

        k = $("#t1").val();

        if (k != ''){

        var text = $('.textbook').html();

        $('.textbook').html(text.replaceAll(`${k}`, "<span class='textspot' style='background-color:yellow;'>" + `${k}` + "</span>"));

        }

      });

    })

    </script>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 2개

3년 전
감사합니다!!
3년 전
필요한거였는데 잘쓰겠습니당.

추신 : </from> =>> </form>

게시글 목록

번호 제목
24318
24317
24315
24309
24294
24293
24277
24262
24260
24253
24251
24236
24233
24228
24226
24221
24214
24203
24201
24199
24196
24195
24194
24192
24191
24187
24185
24183
24172
24168