자바스크립트 URL 요청 - (javascript:)


자바스크립트 URL 요청이란?


보통 마크업 상에서 간단한 자바스크립트를 호출 시 아래와 같이 자바스크립트 URL 요청 방식을 사용하기도 합니다.

"하지만 이 방식은 웹 접근성 저하를 유발하므로 될 수 있으면 사용하지 않는 것이 좋습니다."


  1. <a href="javascript:alert('hello world1');">hello world1</a>
  2. <button onclick="javascript:alert('hello world2');">hello world2</button>
  3. <input type="button" value="hello world3" onclick="javascript:alert('hello world3');"></button>
 

위와 같은 작성 방식을 "javascript: URL 모조 프로토콜(pseudo protocol)"이라 하며, 자바스크립트 표현 식을 평가하고 그에 따른 결과를 출력할 수 있습니다.

코드는 프로토콜 지시자(javascript:)의 세미콜론으로 구분된 임의의 자바스크립트 코드로 작성됩니다.

브라우저는 이러한 URL 요청을 받으면 해당 자바스크립트 코드를 실행하며, 문자열로 반환되면 웹 브라우저에 문서로 출력됩니다.


테스트를 위하여 아래 나열된 코드를 브라우저의 주소창이나 A 태그를 활용하여 확인해 보시기 바랍니다.


  1. javascript:(function(){ alert(document.cookie); })(); // cookie
  2.  
  3. javascript:(function(){ alert(window.location.href); })(); // url
  4.  
  5. javascript:alert((function(){
  6.     return function(){
  7.         var x = 1
  8.           , y = 2;
  9.  
  10.  
  11.         return x + y;
  12.     }
  13. })()()); // 3
  14.  
  15.  
  16. javascript:(function(){
  17.     return function(){
  18.         var x = 1
  19.           , y = 2;
  20.  
  21.  
  22.         return x + y;
  23.     }
  24. })()(); // 3
  25.  
  26.  
  27. javascript:(function(){
  28.     return function(){
  29.         for (n in window.navigator)
  30.         {
  31.             if (n.toLowerCase() === 'useragent')
  32.             {
  33.                 alert(n);
  34.             }
  35.         }
  36.     }
  37. })()(); // useragent