Debug Script in Internet Explorer
인터넷 익스플로어에서 동작하는 스크립트 JavaScript 또는 VBScript를 디버깅하는 방법을 소개한다.
인터넷 익스폴로어에서 동작하는 스크립트를 디버깅하기 위해서는 먼저 디버깅 환경을 제공하는 디버거(Debugger)가 설치되어 있어야 한다.
http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html 를 보면, 디버거로서 3가지를 소개하고 각각에 대해서 다음과 같이 정리하고 있다.
* Microsoft Script Debugger : Pathetic (불충분함)
* Visual Studio .Net : Expensive and overkill (비싸고 좀 오버다~)
* Microsoft Script Editor : The best option (최고다)
라고 하는데, 굳이 Visual Studio가 설치되어 있는데 Microsoft Script Editor 를 이용할 필요는 없을 것이다. 마찬가지로 단지 인터넷 익스플로어에서 동작하는 스크립트만 디버깅하면 된다면 굳이 Visual Studio 보다는 Microsoft Script Editor를 설치하는게 나을 것이다. (Visual Studio는 비싸다~) Microsoft Script Editor 는 Office XP / 2003에는 번들로 제공되기 때문에 이 오피스가 설치되어 있다면 Microsoft Script Editor를 사용할 수 있다. 만약 위 3가지 디버거중에서 아무것도 설치되어 있지 않다면 Microsoft Download Center에서 Microsoft Script Editor를 다운 받길 바란다.
나는 MFC를 이용하여 주로 개발을 하기 때문에 Visual Studio가 이미 설치되어 있다. 그래서 NET 2005 를 사용하여 디버깅하는 모습을 소개할 것이다. (Microsoft Script Editor 를 이용하는 방법은 위에서 소개한 사이트를 참고하자.)
자 이제 디버거가 설치되어 있다면 다음 해야할 일은 스크립트를 디버깅 할 수 있도록 옵션을 설정하는 것이다. 디폴트로 스크립트 디버깅은 아래 그림과 같이 "스트립트 디버깅 사용 안 함"으로 되어 있는 데 이 항목 체크를 해제한 후 확인을 클릭한다.
인터넷 익스플로어(IE) > 도구(Tools) > 인터넷 옵션(Internet option) > 고급 탭 (Advanced)
"스크립트 디버깅 사용안 함"을 해제하면, 인터넷 익스플로어의 보기(View) 메뉴에 스크립트 디버거 항목이 보일것 이다.
자 이제 스크립트가 수행되는 HTML 파일을 열고, 인터넷 익스플로어 메뉴에서 보기 > 스크립트 디버거 > 열기를 선택하면 아래 그림과 같이 디버거를 선택하는 메뉴가 나올 것이다.
원하는 디버거를 선택하자. 예에서는 새 인스턴스 Visual Studio 2005를 선택할 것이다. 선택하면 아래 그림과 같이 HTML 코드가 보이고 <Script > 태그 내에서는 아래 그림과 같이 중단점을 설정할 수 가 있으며, 인터넷 익스플로어에서 함수 수행 시 중단점이 설정되어 있다면 중단점이 있는 곳으로 이동하여 디버거에서 변수값 확인, 단계별 실행등을 수행할 수 있다.
참고로, Script 내에서 중단점을 설정할 수 있는데 debugger 함수를 사용하면 된다. 아래는 Sum 함수 중간에 debugger 함수를 이용하여 중단점을 설정한 예이다.
function Sum() { var a=10; var b=20; var c=a+b; debugger; alert(c); } |
이와 같이 디버깅 환경을 이용하면 좀더 편리하게 스크립트를 작성할 수 있을것이다.
참고 사이트 :
* http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html
* http://www.code101.com/Code101/DisplayArticle.aspx?cid=67