웹 페이지 특정 부분의 소스를 보는 방법입니다.

참고: http://www.microsoft.com/windows/ie/ie6/previous/webaccess/webdevaccess.mspx

1. 에디터를 이용해서 다음 내용을 *.htm 파일로 저장합니다. 여기서는 ViewSource.htm 이라고 지정했습니다.

IE6인 경우
IE6인 경우
  1. <script language="JavaScript" defer>  
  2. var parentwin = external.menuArguments;  
  3. var szsource = parentwin.document.selection.createRange().htmlText;  
  4. if (szsource.length < 1) szsource = parentwin.document.body.outerHTML;  
  5. szsource = szsource.replace(/(^\s*)|(\s*$)/g, "");  
  6. szsource = szsource.replace(/</gi, "&lt;");  
  7. szsource = szsource.replace(/>/gi, "&gt;");  
  8. szsource = szsource.replace(/&lt;(\/)?(\w+)/gi, "&lt;$1<strong>$2</strong>");  
  9. szsource = szsource.replace(/(href|src)\=(\'|\")?([^'\"\s]+)/gi, "<span style='color:#0000FF;font-weight:bold;'>$1</span>=$2<span style='color:#008000;font-weight:bold;'>$3</span>");  
  10. // szsource = szsource.toLowerCase();  
  11. var wbody = "<html>\r\n";  
  12. wbody += "<head>\r\n";  
  13. wbody += "<title>View Source: " + parentwin.location.href + "</title>\r\n";  
  14. wbody += "</head>\r\n";  
  15. wbody += "<body style='font-family:굴림,Gulim;font-size:10pt;line-height:1.5;overflow:auto;'>\r\n";  
  16. wbody += szsource + "\r\n";  
  17. wbody += "</body>\r\n";  
  18. wbody += "</html>\r\n";  
  19. var sourcewin = window.open("about:blank", "_blank", "resizable=1,scrollbars=1,width=640,height=480");  
  20. sourcewin.document.open("text/html", "replace");  
  21. sourcewin.document.write(wbody);  
  22. sourcewin.document.close();  
  23. </script>  

IE7인 경우
IE7인경우
  1. <script language="JavaScript" defer>  
  2. var parentwin = external.menuArguments;  
  3. var szsource = parentwin.document.selection.createRange().htmlText;  
  4. if (szsource.length < 1) szsource = parentwin.document.body.outerHTML;  
  5. szsource = szsource.replace(/(^\s*)|(\s*$)/g, "");  
  6. szsource = szsource.replace(/</gi, "&lt;");  
  7. szsource = szsource.replace(/>/gi, "&gt;");  
  8. szsource = szsource.replace(/&lt;(\/)?(\w+)/gi, "&lt;$1<strong>$2</strong>");  
  9. szsource = szsource.replace(/(href|src)\=(\'|\")?([^'\"\s]+)/gi, "<span style='color:#0000FF;font-weight:bold;'>$1</span>=$2<span style='color:#008000;font-weight:bold;'>$3</span>");  
  10. // szsource = szsource.toLowerCase();  
  11. var wbody = "<html>\r\n";  
  12. wbody += "<head>\r\n";  
  13. wbody += "<title>View Source: " + parentwin.location.href + "</title>\r\n";  
  14. wbody += "</head>\r\n";  
  15. wbody += "<body style='font-family:굴림,Gulim;font-size:10pt;line-height:1.5;overflow:auto;'>\r\n";  
  16. wbody += szsource + "\r\n";  
  17. wbody += "</body>\r\n";  
  18. wbody += "</html>\r\n";  
  19. var sourcewin = parentwin.open("about:blank", "_blank");  
  20. sourcewin.document.open("text/html", "replace");  
  21. sourcewin.document.write(wbody);  
  22. sourcewin.document.close();  
  23. </script>  

2. 위의 파일을 원하는 폴더에 복사합니다. 여기서는 C:\Program Files\Internet Explorer\에 저장했습니다.

3. 레지스트리 편집기를 열어 [HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt] 를 찾아갑니다.

4. View Source라고 새 키를 생성한 다음, 기본값 데이터를 위 파일의 경로로 지정합니다.

5. Contexts라는 DWORD 값을 추가하여 16진수 입력에 30라고 입력합니다.

Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\View Source]
@="C:\\Program Files\\Internet Explorer\\ViewSource.htm"
"Contexts"=dword:00000030


6. 브라우저를 종료하고 다시 실행

사용 방법:
원하는 부분을 선택해서 마우스 오른쪽을 클릭해 View Source를 선택합니다.

001.jpg

참고로 동영상만 선택하는 경우 오른쪽 메뉴를 쓸 수 없으므로 가급적 동영상 주변의 다른 부분도 같이 선택해주는게 좋습니다.

소스보기창입니다.
002.jpg

이런 식으로 해당 영역의 소스를 볼 수 있습니다.

예제 다운로드
viewsource_ie6.zip
viewsource_ie7.zip

크게 다른건 없지만 살짝 업데이트
viewsource_ie6_updated.zip
viewsource_ie7_updated.zip


크리에이티브 커먼즈 코리아 저작자표시Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락/3.0에 따라 이용하실 수 있습니다

이 게시물을..
마가린 바르기 bookmarkr.net metags WZD.com 네이버에 북마크 다음에 북마크 HanRSS에 북마크하기 이올린에 북마크하기 Pumfit에 글 올리기 News2.0에 투고하기 del.icio.us에 북마크하기 붐바