일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
Tags
- #이미지
- 홈페이지제작
- 해피CGI
- 해피씨지아이
- #홈페이지제작
- #동영상
- 이미지
- 홈페이지
- #업종별
- happycgi
- php
- #웹솔루션
- #happycgi
- javascript
- #CSS
- CGIMALL
- #해피CGI
- 솔루션
- jquery
- 사이트제작
- #홈페이지
- #cgimall
- #image
- #쇼핑몰
- #jQuery
- CSS
- #솔루션
- #뉴스
- 웹솔루션
- 게시판
- Today
- Total
웹솔루션개발 25년 노하우! 해피CGI의 모든것
[해피CGI][cgimall] 텍스트 하이라이트 플러그인 - advanced-mark.js 본문
advanced-mark.js는 웹 페이지에서 문자, 단어, 용어, 구문, 심지어 텍스트 범위를 강조 표시하는
빠르고 가벼운 JavaScript 라이브러리입니다.
advanced-mark.js는 가상 DOM을 지원하므로 콘텐츠가 변경될 때 하이라이트를 효율적으로 업데이트하여
다양한 플랫폼에서 통합을 쉽게 할 수 있습니다.
라이센스는 MIT 입니다.
# 사용방법
1. 설치 및 다운로드

2 .advanced-mark.js를 가져옵니다.

3. 이 mark()방법을 사용하면 찾으려는 용어를 전달하여 텍스트를 강조 표시할 수 있습니다.
4. 더욱 고급 매칭을 위해 markRegExp()텍스트 패턴을 타겟으로 하는 정규 표현식을 허용합니다.

5. 이 markRanges()방법은 특정 문자 범위를 강조합니다.

6. 이 unmark()방법을 사용하여 모든 표시를 지웁니다.

7. CSS에서 강조 표시된 콘텐츠의 스타일을 지정합니다.

해당 플러그인으로 테스트를 해 봤는데요.
한글도 잘 됩니다.

위 테스트 파일은 압축해제하시면 test.html 에 구성되어 있습니다.
전체적인 설명은 NPM 사용방식으로 설명했지만 test.html 은 쉽게 사용하시라고 CDN 방식으로 작성하여 추가해 두었습니다
다양한 플랫폼에서 통합을 쉽게 할 수 있습니다.
라이센스는 MIT 입니다.
# 사용방법
1. 설치 및 다운로드

2 .advanced-mark.js를 가져옵니다.

3. 이 mark()방법을 사용하면 찾으려는 용어를 전달하여 텍스트를 강조 표시할 수 있습니다.

4. 더욱 고급 매칭을 위해 markRegExp()텍스트 패턴을 타겟으로 하는 정규 표현식을 허용합니다.

5. 이 markRanges()방법은 특정 문자 범위를 강조합니다.

6. 이 unmark()방법을 사용하여 모든 표시를 지웁니다.

7. CSS에서 강조 표시된 콘텐츠의 스타일을 지정합니다.

해당 플러그인으로 테스트를 해 봤는데요.
한글도 잘 됩니다.

위 테스트 파일은 압축해제하시면 test.html 에 구성되어 있습니다.
전체적인 설명은 NPM 사용방식으로 설명했지만 test.html 은 쉽게 사용하시라고 CDN 방식으로 작성하여 추가해 두었습니다
'웹프로그램밍 자료실 > JAVA 자료' 카테고리의 다른 글
[해피CGI][cgimall] Ace Editor - 쉽게 사용이 가능한 코드 에디터 (0) | 2025.05.02 |
---|---|
[해피CGI][cgimall] 가벼운 반응형 비디오 배경 플러그인 - videoBackground (0) | 2025.04.30 |
[해피CGI][cgimall] Crossy Road with three (0) | 2025.04.22 |
[해피CGI][cgimall] 스와이프로 닫는 토스트 알림 플러그인 - jQuery swipetoast (0) | 2025.04.18 |
[해피CGI][cgimall] 진행률 막대와 애니메이션이 있는 토스트 알림 - jQuery myOwnUIToaster (0) | 2025.04.17 |
Comments