자바스크립트 팁 (고급 팁)

· 15년 전 · 2638

ㅇ try catch문
   사용할때 : 보통 자바스크립트로 작업하다 보면 정말 어떨때는 구문에서 틀리지도 않았는데,
               브라우저 버젼에 따라 에러가 발생하기도 하고, 정말 몇달간 디버깅에 지칠때도 있다.
               대부분 열심히하면 나타나는데, 다음의 try catch문을 사용하면 편리하다.
   사용예   :
             try
             {
                  // 실제 실행시킬부분
                  var a   = opener.location.href;
             }
             catch (e)
             {
                  // 위의 "실행시킬부분"에서 에러가 났을때 처리해줄 부분
                  alert ("opener를 찾을수 없습니다.");
             }
             finally
             {
                  // 에러가 나든 나지 않든 무조건 실행시키는 부분
                  window.status   = "opener.locatoin.href 부분 실행되었음";
             }
ㅇ typeof문
   사용할때 : 보통 데이터나 오브젝트 타입등을 검사할때 많이 사용하는데.
                만약 "undefined"이면 인식을 못한거고 "unknown"이 나올때가
                있다.. 만약 부모창에서 새창을 열고 부모창을 닫았는지 새창에서 검사할때
                if (typeof (opener) == "unknown") 이면 으로 검사할때 유용하다~ㅇ

ㅇ regExp (정규표현식)
   사용할때 : 만약 <textarea name="taContent"></textarea>에 사용자가 입력한  value값중에서
                "/아싸1/" ~ "/아싸10/" 까지를 다 "/호호1/" ~ "/호호10/" 까지로 바꿀려면 어케할까?
               
                var sTaContent   = taContent.value;
                for (var nI = 1; nI <= 10; nI++)
                {
                       var expTest = new RegExp("/아싸" + nI + "/", "ig");   // i는 대소문자 구분없고, g는 중복되어도 다처리
                       sTaContent   = sTaContent.replace (expTest, "/호호" + nI + "/");
                }
                taContent.value   = sTaContent;
            
                하면 된다~ㅇ

                위의 expTest의 메소드들도 몇개있으므로 알아두면 많이 도움이 된다~ㅇ
                또한, 게시판의 글보기에 나오는 글들에 자동링크 걸때도 사용한다~ㅇ

ㅇ var a="08", b="09"일때
   parseInt (a)나 parseInt (b)의 값은 0 이다
   Number (a)나 Number (b)값을 해야 제대로 8과 9의 값이 나온다~ㅇ
   한번 고생한적이 있어서여~ㅇ 다른분들에게 도움이 되었으면...

ㅇ   <img name="pic1" src="">
   <img name="pic2" src="">
   <img name="pic3" src="">

   위와 같이 있고 javascript에서 pic1 ~ pic3의 src주소값을 바꾸고자 할때
  
   for (var nI = 1; nI <= 3; nI ++)
   {
        eval("document.pic" + nI + ".src ='http://image.aaa.com/p" + nI + ".gif'");
   }
  
   위와 같이 eval을 넣어주어야 되더라구여~ㅇ

ㅇ 현재의 html파일을 다른이름을로 저장할때 뜨는 dialog박스를 열어서 저장하고 싶을때
  
   그냥 다음한줄을 실행시키면 저장 dialog박스가 뜨는걸로 뭐하는지 알겁니다~ㅇ
   document.execCommand("SaveAs", null, "a.html")

   다르게하면 다음의 한줄을 넣고
   <iframe name="ID_LOG" style="display:none"></iframe>가 body에 있다고 하고

   var sHTML = "<center>Testing...</center>";
   document.all.ID_LOG.document.close ();
   document.all.ID_LOG.document.write (sHTML);
   document.all.ID_LOG.document.execCommand("SaveAs", null, sFileName);

   하면 Testing가 찍히는 html문서를 저장할수 있져~ㅇ 그런데 이거는 IE 5.5이상에서만 됩니다.

   5.0에서는

   var sHTML   = "<input type='button' value='저장' onClick=\"window.document.execCommand('SaveAs', null, 'a.html')\">";
       sHTML   += "<br><center> Testing..</center>";
  
   var oLogWin   = window.open ("", "popLog", "어쩌구...");
  
   oLogWin.document.write (sHTML);

   해서 새창띄워서 클릭하게 하면 됩니다~ㅇ

ㅇ 그리고 Javascript에서 name이나 id값이 같은것이 있으면 Array로 변하더군요...
   Javascript많이 사용하다보면 많이 접하셨을겁니다~ㅇ
  
   동적으로 name이나 id값이 1나 1이상을로 늘어날때에

   <span id="ID_A"></span>
   <span id="ID_A"></span>
   이 있다고 할때

   Javascript 안에서 에서

   var oID_A   = document.all.ID_A;

   if (typeof (oID_A [0]) != "undefined")) // 1개 이상일때
   {
  
   }
   else   // 1개만 있을경우
   {
  
   }

   물론 "ID_A" id값을 가지고 있는것이 있는지 먼저 검사하면 좋져~ㅇ

ㅇ 만약 a와 b와 c의 값을 구분자 ","로 구분하는 String (a,b,c)을 만들고 싶을때

   var oTmpArray = new Array ("a", "b", "c");
   var sValue = oTmpArray.join (",");

ㅇ javascript 연관배열
  
   var oMethod =   {
        "ALERT"   : goAlert,
        "MSG"   : goMsg
   }

   oMethod ["ALERT"] 는
   goAlert가 됩니다.

ㅇ onLoad, onClick, onMousewheel... 등등의 이벤트를 붙이거나 떼기
  
   window.attachEvent ("onscroll", procScroll);
    하면 onscroll이벤트 발생시 procScroll함수 실행
  
   window.detachEvent ("onscroll", procScroll);
   하면 onscroll이벤트 떼기

ㅇ 움직이는 gif이미지를 key이벤트나 등등 이벤트사용하면 움직이던 gif이미지가 멈추어버립니다.
   알고보니 return값땜시 "event.returnValue = 'false'" 해주면 되더라구여~ㅇ

ㅇ ActiveX를 사용시 ActiveX클라이언트가 ActiveX를 다운 받았는지 확인할때는
  
   <object name=AX1 id=AX1></object> 가 있을때

   var bnResult   = typeof (AX1.proc) == "unknown")? true : false;
   proc는 AX1의 method입니다~ㅇ
   이렇게 확인하면 되더라구여~ㅇ

ㅇ F5번 누를때 경고창(confirm같은것)띄워서 새로고침 할건지 물어보기
  
   window.onbeforeunload   = hoho ();

   function hoho ()
   {
        var sMsg = "새로고침을 정말로 정말로 정말로 할꺼예여?";
        return (sMsg);
   }
   물론 F5번 눌렀을때를 key Event로 잡아서 함수안에서 실행해도 됩니다~ㅇ

ㅇ VBscript에만 있는줄 알았던 with 많이 쓰일때가 있더군요 switch문을 안에다가 사용하면 정말 깔끔!
  
   with (window)
   {
        onload    = pageOnLoad;
        onunload = pageUnload;
   }

 
[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
15년 전 조회 2,515
15년 전 조회 1,487
15년 전 조회 1,026
15년 전 조회 1,180
15년 전 조회 1,185
15년 전 조회 1,050
15년 전 조회 951
15년 전 조회 878
15년 전 조회 1,241
15년 전 조회 1,196
15년 전 조회 942
15년 전 조회 920
15년 전 조회 1,091
15년 전 조회 1,550
15년 전 조회 1,085
15년 전 조회 1,414
15년 전 조회 1,251
15년 전 조회 1,920
15년 전 조회 2,986
15년 전 조회 2,320
15년 전 조회 918
15년 전 조회 1,928
15년 전 조회 2,112
15년 전 조회 1,417
15년 전 조회 1,387
15년 전 조회 2,656
15년 전 조회 2,544
15년 전 조회 5,526
15년 전 조회 1,495
15년 전 조회 4,256
15년 전 조회 1,386
15년 전 조회 1,689
15년 전 조회 1,651
15년 전 조회 1,637
15년 전 조회 1,139
15년 전 조회 1,391
15년 전 조회 1,527
15년 전 조회 1,442
15년 전 조회 2,158
15년 전 조회 1,304
15년 전 조회 1,364
15년 전 조회 915
15년 전 조회 1,018
15년 전 조회 988
15년 전 조회 946
15년 전 조회 898
15년 전 조회 959
15년 전 조회 1,102
15년 전 조회 1,113
15년 전 조회 2,639
15년 전 조회 966
15년 전 조회 1,621
15년 전 조회 1,491
15년 전 조회 1,618
15년 전 조회 1,319
15년 전 조회 1,814
15년 전 조회 629
15년 전 조회 1,117
15년 전 조회 1,083
15년 전 조회 2,868
15년 전 조회 3,191
15년 전 조회 1,866
15년 전 조회 1,376
15년 전 조회 1,992
15년 전 조회 1,496
15년 전 조회 1,091
15년 전 조회 3,789
15년 전 조회 1,442
15년 전 조회 1,528
15년 전 조회 2,763
15년 전 조회 1,455
15년 전 조회 4,184
15년 전 조회 2,393
15년 전 조회 3,176
15년 전 조회 1,786
15년 전 조회 2,017
15년 전 조회 1,317
15년 전 조회 4,401
15년 전 조회 3,980
15년 전 조회 3,799
15년 전 조회 5,221
15년 전 조회 3,434
15년 전 조회 1,824
15년 전 조회 1,776
15년 전 조회 1,924
15년 전 조회 1,612
15년 전 조회 4,012
15년 전 조회 2,931
15년 전 조회 2,109
15년 전 조회 1,691
15년 전 조회 1,925
15년 전 조회 2,414
16년 전 조회 1,487
16년 전 조회 2,422
16년 전 조회 1,754
16년 전 조회 1,856
16년 전 조회 1,507
16년 전 조회 2,201
16년 전 조회 1,531
16년 전 조회 1,945