Mark.js가있는 웹 페이지에 검색 키워드 강조 표시 추가

대부분의 브라우저에는 CTRL + F 기능 사용자가 찾고있는 것을 검색하고 찾으십시오. 그러나이 기능 모바일 장치에서 지원되지 않습니다. 동적 텍스트를 사용하면 잘 작동하지 않습니다..

다행히도 Mark.js, 자바 스크립트 플러그인을 추가하는 무료 자바 스크립트 검색 기능 강조 어떤 페이지 로든지 쉽게.

기본적으로이 기능은 바닐라 JS 플러그인 하지만 또한 실행할 수 있습니다. jQuery 위에. 완전히 오픈 소스 프로젝트이므로 상업용 또는 기타 웹 사이트에서 자유롭게 사용할 수 있습니다..

그것은 여분의 좋은 점을 제외하고는 어떤 브라우저 검색 기능과도 비슷합니다. 추가 할 수 있습니다. 나만의 맞춤 필터 에 기초한 단어 검색 정규식, 특정 동의어, 심지어는 동적 페이지 요소 iframe과 같은.

시작하려면 Mark.js 파일을 다운로드하기 만하면됩니다. GitHub에서 또는 파일 호스트 CDN을 통해 시간을 절약하기 위해.

이 함수를 실행해야합니다. 입력 필드에 연결된 페이지에. 이 방법으로 사용자는 검색어 및 즉각적인 피드백 받기 강조 표시된 텍스트를 통해.

여기에 샘플 스 니펫 데모 페이지에서

 $ ( ". context") .mark (키워드 [, options]); 

그만큼 .문맥 함수가 어디에 있든간에 클래스 대상 용어 검색. 당신은 기본 HTML 요소 전체 페이지를 검색하려고하거나 페이지를 넘길 수있는 경우 여러 요소들 다른 탭 위젯 또는 iframe과 같은.

그런 다음 표() 너를 기능시키다. 키워드를 전달하십시오., 옵션과 함께 (원하는 경우).

사용자가 키워드를 입력 할 수있게하면 자동 업데이트 기능 키를 누를 때마다 새 키워드가 표시됩니다. 이 이벤트를 타겟팅하는 특정 기능조차 있습니다..

Mark.js 모든 주요 브라우저에서 작동합니다., Firefox, Opera (v12 이상) 및 Internet Explorer (9 이상)를 비롯한 다양한 브라우저를 지원합니다. 문서를 읽고 최신 파일을 사용하는 경우 설정이 쉽습니다..

하지만,보고 싶다면 행동중인 Mark.js ~을 들여다 보아라. 아래의 바이올린 아주 기본적인 jQuery 데모를 사용하여 Lorem Ipsum의 몇 단락을 검색하십시오..