jsfiddle 이용하여 js code 블로그에 embedding 하기

jsfiddle.net 은 브라우져에서 html5, css, javascript를 개발하고 테스트 해볼 수 있는 서비스이다. 사용법을 공부하던중 jsfiddle을 통하여 javascript 코드에 대한 테스트 및 결과를 하기와 같이 embedded 할 수 있는 방법이 있다. 

▶ jsfiddle 코드 웹페이지에 넣기 

  - 공식 참조 문서

  - http://{url_of_the_fiddle}/embedded/[{tabs}/[{style}]]/  구성이고 iframe으로 넣는다 

<iframe

  style="width: 80%; height: 200px"

  src="http://jsfiddle.net/nulpulum/w9NJZ/embedded/js,resources,html,css,result">

</iframe>

  - 위 코드에서 nulpulum은 등록 계정, w9NJZ 은 페이지 그리고 맨뒤의 js,resources,html,css,result 구분자는 탭을 의미한다.

  - Result 탭 옆의 > 아이콘을 클릭하면 Result 탭으로 자동이동하면서 html 수행결과를 볼 수 있다. 

이제 테스트 코드를 jsfiddle을 이용하여 블로그에 넣어보자