Javascript로 Javascript/HTML 놀이터를 구현하려면 어떻게해야합니까?

jsFiddle과 같은 간단한 Javascript 놀이터를 구현하고 싶습니다.이를 달성하는 가장 좋은 방법이 궁금합니다. jsfiddle이 작동하는 방식부터 제출 된 HTML/Javascript 코드로 iframe을 만듭니다. iframe의 소스는 jsfiddle 서버의 동적으로 생성 된 페이지에서 가져옵니다.Javascript로 Javascript/HTML 놀이터를 구현하려면 어떻게해야합니까?

클라이언트 사이드 자바 스크립트 코드에서만이 작업을 수행 할 수 있는지 궁금합니다. 나는 (사용자 지정 코드가 실행되지 않고, JQuery와는 iframe에로드 된 경우 모르는)이을 시도했지만 작동하지 않습니다 또한

$iframe = $(document.createElement("iframe")) 

$html = $iframe.contents().find("html") 

//HTML code 
$html.children("body").append($(htmlcode)) 

//Javascript code (first jquery and then custom code) 
$script = $(document.createElement("script")) 
$script.attr("src","jquery.js") 
$html.children("head").append($script) 

$script = $(document.createElement("script")) 
$script.html(javascriptcode) 
$html.children("head").append($script) 

$iframe.appendTo($("body"));

출처

2011-12-11 Seb

> "작동하지 않습니다"< –

서면으로 무슨 뜻인지는 사용자 지정 코드가 실행되고 있지 않으며 jQuery 코드를로드 할 것 같다 것입니다.. 나는 브라우저가 이것을 허용하지 않지만 이유에 대한 설명을 원한다고 생각한다. – Seb

그리고 내가 말한 것은 모든 디버깅 문제를 전혀 좁히지 않았다는 것이다. –

당신은 그 복잡 할 필요는 없습니다.
새 창 (또는 iframe)을 열고 HTML을 넣기 만하면됩니다.

데모 : http://jsfiddle.net/DerekL/uSrU6/4 (이 업데이트)

출처

2011-12-11 21:34:19

감사합니다. 그러나 텍스트 영역에서 이와 같은 것이 작동하지 않습니다.

– Seb

@seb의 경우 'head'에 입력해야합니다. –

위와 같은 결과를 얻었습니다. – Seb

내가 정확히 당신이 뭘 하려는지 이해 완전히 확실하지 않다 .

당신은 $html는 $iframe 자체하지만 내용이 .. 내가 contents()는 DOM 요소를 반환하지 않습니다 생각하지 동안 $html.children('head')에 스크립트를 추가하려고 : 난 당신이 게시 코드에서 실수를 생각 나머지는 어쨌든 유효하지 않습니다. 편집는 - 지금은 그래서 이것은 아마 문제 왠지 JS에게 다른 도메인의 libs와 전화 크로스 사이트 스크립팅에 문제가 거기에 기억
가 아닌 일반 JS 당신을 위해 작동 않는다는 의견 참조 iframe. 확실하지 않아요

편집 : 발견 : here 아마도 이것이 문제입니다. 여기도 해결책이 있습니다

출처

2011-12-11 21:05:41 alonisser

Javascript로 Javascript/HTML 놀이터를 구현하려면 어떻게해야합니까?

답변

관련 문제