> 웹 프론트엔드 > JS 튜토리얼 > cnblogs 코드 강조 코드 복사 문제 해결 구현 Code_Javascript 기술

cnblogs 코드 강조 코드 복사 문제 해결 구현 Code_Javascript 기술

WBOY
풀어 주다: 2016-05-16 17:58:35
원래의
1179명이 탐색했습니다.

의외로 최근(2012년 12월)에 코드 복사 문제가 발생했습니다. 그렇지 않으면 모든 내용이 한 줄로 되어 있어 도구가 있는 사람만 코드를 빠르게 볼 수 있으므로 코드 사용이 훨씬 간편해지고 복사가 가능해집니다. 매번 변환할 필요가 없습니다.
이 글의 기술은 주로 기술에 관한 것이며, 도움이 필요한 친구들이 어떤 방법을 사용했는지 살펴보겠습니다. 백업을 용이하게 하려면 먼저 코드 사본을 패키징하고 필요한 경우 직접 연구하십시오.

코드 복사 코드는 다음과 같습니다.

//#region 코드 복사 및 실행

$(function () {
var hlCodes = $("#cnblogs_post_body div.cnblogs_code");
if (hlCodes.length) {
loadEncoderJs();
$.each( hlCodes, function () {
var htmlContent = $(this).html()
$(this).html(htmlContent.replace(/(){3}/ gi, '

'))
if ($(this).find("div.cnblogs_code_hide").length == 0) {
if (parseInt ($( this).css("height"), 10) > 30) {
showCopyCode($(this))
var regex = //gi;
if (regex.test($(this).text())) {
showRunCode($(this));
}
}
}
});
}
})

function showCopyCode(element) {
$(element).append('
코드 복사'); 🎜> }

function loadEncoderJs() {
var 인코더Js = document.createElement('script')
encoderJs.type = 'text/javascript'
encoderJs.src = ' http: //common.cnblogs.com/script/encoder.js';
var node = document.getElementsByTagName('script')[0]
node.parentNode.insertBefore(encoderJs, node); 🎜> }

function copyCnblogsCode(element) {
var codeContainer = getCnblogsCodeContainer(element);
var cbCode = getCnblogsCodeText(codeContainer)
var textarea = document.createElement('textarea' );
$(textarea).val(cbCode).select();
$(textarea).css("width", $(codeContainer).css("width")); (textarea ).css("height", $(codeContainer).css("height"));
$(textarea).css("font-family", "Courier New")
$( textarea) .css("font-size", "12px");
$(textarea).css("line-height", "1.5")
$(codeContainer).parent().html (textarea );
$(textarea).select();
$("
코드를 복사하려면 Ctrl C를 누르세요
").insertAfter($(textarea)); >}

function getCnblogsCodeContainer(element) {
var codeContainer = $(element).parent().parent().parent().find("pre")
if (codeContainer) .length = = 0) {
codeContainer = $(element).parent().parent().parent().find("div").first()
}
return codeContainer;
}

function getCnblogsCodeText(codeContainer) {
var cbCode = 'n' $(codeContainer).html()
.replace(/ /g, ' ')
. 교체(/ /ig, 'n')
.replace(/<[^>]*>/g, ''); (/n (s*d )/ig, 'n');
cbCode = cbCode.replace(/n/g, 'rn')
if (typeof Encoder != 정의되지 않음) {
cbCode = Encoder .htmlDecode(cbCode);
}
cbCode = $.trim(cbCode);
return cbCode;
}

function showRunCode(element) {
var codeCopyDiv = $(element).find("div.cnblogs_code_toolbar")
if (codeCopyDiv.length) {
$(codeCopyDiv).append('< a href= "javascript:void(0);" onclick="runJsCode(this)">코드 실행')
}
}

function runJsCode (요소) {
var codeContainer = getCnblogsCodeContainer(element);
var cbCode = getCnblogsCodeText(codeContainer);
var newwin = window.open('', "_blank", ''); 🎜> newwin.document.open('text/html', 'replace');
newwin.opener = null
newwin.document.write(cbCode)
newwin.document.close() ;
}

//#endregion



패키지 다운로드
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿