개발노예 코드와 일상

검색 서치결과페이지에서

검색어에 하이라이트를 줘야겠다

php로 하면 편하지만 php를 사용하는 홈페이지가 아니어서

javascript로 따로 결과에 추가해줬다

//직원 검색어 하이라이트 추가
search_filter();    
function search_filter(){
    var search = $('#searchKeyWord').val();
    var sf_cnt = 0;
    $(".sc_td, .sch_li p, .table_view td a").each(function () {
        var regex = new RegExp(search,'gi');
        
        $(this).html( $(this).text().replace(regex, "<span class='text-danger bold'>"+search+"</span>") );
        
        sf_cnt = sf_cnt+1;
    });
};  

text-danger 클래스에 css로 컬러를 넣어놨다

코드저장..

검색페이지를 만드는데

이번에는 주로하던 php 페이지가 아니라 java로 제작페이지여서

javascript로 검색결과에 검색어 표시를 해줘야했다

결과적으로는 크게 복잡하지않았다

search_filter();
function search_filter(){
var search = $('#searchKeyWord').val();
var sf_cnt = 0;
$(".sc_td").each(function () {
var regex = new RegExp(search,'gi');

    $(this).html( $(this).text().replace(regex, "<span class='text-danger bold'>"+search+"</span>") );

    sf_cnt = sf_cnt+1;
});

};

replace 함수를 사용하고있고
해당 구역에서 키워드 텍스트를 찾아서 span으로 한번 둘러싸주는 형식

순조롭게 적용되서 굳이었다