prettify 코드 하 이 라이트 착색 기 google 제품
<link href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css" rel="stylesheet" type="text/css"/>
<script src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js" type="text/javascript"/>
<body onload='prettyPrint()'>
<pre class=”prettyprint”>
/*source code*/
오늘 이 글 은 주로 google-code-pretify 를 사용 하여 코드 의 하 이 라 이 트 를 실현 하 는 것 을 다 루 었 습 니 다.예전 에 저 는 하 이 라이트.js 를 사용 하여 글 의 코드 하 이 라 이 트 를 실현 하 였 습 니 다.prettify 는 매우 작고 설정 이 간단 합 니 다.코드 의 하 이 라 이 트 를 실현 하 는 데 사용 하 는 것 이 좋 습 니 다.다음은 prettify.js 의 사용 방법 을 간단히 살 펴 보 겠 습 니 다.
1.jQuery 파일 과 prettify.js 파일 도입
<scripttype="text/javascript"src="jquery-1.6.1.min.js"></script>
<scriptsrc="prettify.js"type="text/javascript"></script>body 탭 에 호출 방법 을 추가 합 니 다.다음 과 같 습 니 다.
하 이 라이트 가 필요 한 코드 세 션 을
태그 에 넣 습 니 다.다음 과 같 습 니 다.jQuery 기술 로 최적화<pre class="prettyprint"> @* *@ </pre>
상기 방법 은 코드 의 하 이 라 이 트 를 실현 할 수 있 으 나,매번 수 동 으로태그 에"prettyprint"클래스 를 추가 할 때마다 번 거 로 움 을 표시 합 니 다.아래 코드 세 션 을 사용 하여 이 문 제 를 해결 하고 body 의"onload"사건 을 교체 하여 분 리 를 실현 합 니 다.이 쯤 되면 우 리 는 prettify.js 를 성공 적 으로 사용 하여 코드 의 하 이 라 이 트 를 실 현 했 을 것 입 니 다.페이지 로 딩 속 도 를 높이 기 위해 서 는 인 용 된 js 파일 을 아래쪽 에 두 어야 합 니 다.$(window).load(function(){ $("pre").addClass("prettyprint"); prettyPrint(); })
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
vue 단일 페이지에 여러 개의 echarts 도표가 있을 때의 공용 코드 쓰기html에서: 데이터 처리는 말할 필요가 없다.응, 직접 그림을 그려: 공통 섹션: 이 페이지를 떠날 때 파괴: 추가 정보: Vue + Echarts 차트 표시 및 동적 렌더링 준비 작업 echarts 의존 설치 n...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
