[자바스크립트 팁] 링크 총정리(점선없애기,주소 감추기,this,event사용주의)

원
http://home.hanmir.com/~epjang



그동안 책이나 계시판, 제 경험에 의한 동작을 한 자리에 모아봤읍니다.

[점선없애기]===================================================================

익스플로러에서는 this.blur()나 hidefocus를 이용합니다.

  <a href="javascript:void(0)" onclick="this.blur()"> 점선없음 </a>
  <a href="javascript:void(0)" hidefocus="true"> 점선없음 </a>

스크립트를 작성할때는 hidefocus가 유용합니다.

이전 링크의 onblur 핸들러에 등록된 명령어나 함수가 덮어쓰여질 위험이 없기 때문입니다.

  <div id="dotNo">
        <a href="javascript:void(0)">링크</a> <a href="javascript:void(0)">링크</a>
    </div>
  <script>
      var objArea = document.getElementById('dotNo');
      var objLinks = objArea.getElementsByTagName('a');

      for(var i=0; i<objLinks.length; i++)
      {
          objLinks.item(i).hideFocus = function(){return true;}; // hideFocus대소문자 주의!!
      }
 
      /*
      objLinks.item(i).onblur = function(){return false;}; 는 기존의 링크 onblur에 등록된
      명령어와 함수를 덮어쓰므로 추천하지 않습니다.
      */
  </script>

넷스케이프에서는 hidefocus는 지원되지 않으며 blur()는 폼요소에만 적용되는 것
같읍니다.

따라서 보이지 않는 폼요소 hidden을 이용하여 포커스를 이동시킵니다.
익스플로러에는 보이지 않는 폼요소에 포커스를 줄 경우 런타임에러를
발생시킴으로 사용할 수 없읍니다.

<!-- 넷스케이프 전용-->
<div id="noDot">
  <a href="javascript:void(0)"> 점선없음</a>
  <a href="javascript:void(0)"> 점선없음</a>
</div>

<input type="hidden" id="elm" /> <!-- 보이지 않는 요소 -->
<script>
  var objArea = document.getElementById('noDot');
      objArea.onclick = function(){document.getElementById('elm').focus();}

</script>


[javascript: event,this는 사용할 수 없습니다.]====================================

  javascript: 프로토콜과 onXXX 이벤트핸드러는 모두 명령어을 실행하지만
  this, event는 프로토콜에서 사용할 수 없습니다.

      this는 a 요소가 아닌 현재 페이지의 window개체를 가리킵니다.
        <a href="javascript:alert(this==window)">클릭</a>

      이벤트 개체는 null로 나타납니다.
        <a href="javascript:alert(event)">클릭</a>


  this, event를 사용하려면 반드시 이벤트 핸들러 onXXX를 이용해야 합니다.

[ 주소 감추기]========================================
  완전하게 주소를 감춘다는 건 불가능합니다.
  다만 일반사용자분들의 링크방지를 위해 감추어 둘 뿐이겠죠.

  - 팝업창의 F11 기능 막기

      <script>
      document.onkeydown = function()
      {
          event.keyCode = 0; // 핵심!
          return false;
      }
    </script> 

  - 상태바에 주소 감추기

      <a href="http://www.phpschool.com" onmouseover="return true">주소감춤</a>
      <a href="http://www.phpschool.com" onmouseover="window.status='PHP스쿨';return true" onmouseout="window.status=''">주소 감추고 글자로 대신하기</a>

    - 항상 주소 감추기

    위의 onmouseover="return true"는 클릭시에는 주소가 상태바에 나타납니다.
    모든 상황에서 주소바가 나타나지 않으려면 (잠깐은 보였다 사라집니다.)
    아래 코드를 이용하세요

    그러나 계속 함수호출이 일어나므로 페이지 분량이 많다면 속도를 저하시킬 수 있으므로
    주의해서 사용하셔야 합니다.(비추천)

      <a href="http://www.phpschool.com">주소감춤</a>
      <a href="http://www.phpschool.com">주소감춤</a>

      <script>
      setInterval('window.status=""',5);
      </script>