>  기사  >  웹 프론트엔드  >  Z-Blog에서 코드 실행 [html][/html] (순수 JS 버전)_javascript 기술

Z-Blog에서 코드 실행 [html][/html] (순수 JS 버전)_javascript 기술

WBOY
WBOY원래의
2016-05-16 19:16:001123검색

어제의 "th, colgroup, col을 사용하여 테이블 스타일 정의"에서 주의 깊은 친구들은 "실행 코드" 링크가 추가되었음을 발견할 것입니다. 텍스트 영역에서 콘텐츠를 실행하려면 직접 클릭하십시오. 사실 Blue Ideal과 51JS에 관련된 소개가 있고, Z-Blog 공식 포럼에도 비슷한 글이 있습니다. 왜냐하면 저는 ASP의 내용을 바꾸는 것을 좋아하지 않기 때문입니다(업그레이드할 때 교체할 필요는 없습니다). 미래) 그래서 게을러서 순수 JS 버전을 만들었습니다.
FireFox와 호환되는지 테스트할 시간이 없었습니다. "다른 이름으로 저장"과 "복사" 기능도 중복되는 것 같아서 여기에서는 생략했습니다. Fix Bug나 기술 지원이 필요하시면 메시지를 남겨주세요^_^ 구체적인 코드는 다음과 같습니다.

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

function RunCode() {
var ele = document.getElementsByTagName("textarea")
for (var i=0; i with (ele[i]) {
if (className != "code") continue
var o = document.createElement("p")
var a = document.createElement("a") ;
var em = document.createElement("em");
o.className = "runCode";
a.href = "javascript:;"; 🎜> a.innerHTML = "코드 실행";
a.onclick = function() {
var win = window.open('', "_blank", ''); open('text/html', 'replace');
win.document.writeln(this.parentNode.previousSibling.value.replace(/u00a0/gi, " ")); win.document.close ();
}
em.innerHTML = "(팁: 실행하기 전에 코드의 일부를 수정할 수 있습니다)"
o.appendChild(a)
o.appendChild(em);
insertAdjacentElement("afterEnd",o ;
insertAdjacentElement("afterEnd",o);
this.parentNode.previousSibling.value
replace(/u00a0/gi, " ")는 주로 c_function.asp 파일( )로 대체된 공백에 사용됩니다. 및 Tab( )을 사용하여 복원합니다. 물론 사용법 측면에서 보면, className이 code인 텍스트 영역만큼 "코드 실행" 기능이 많이 있습니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.