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

· 15년 전 · 2686

ㅇ 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,545
15년 전 조회 1,523
15년 전 조회 1,065
15년 전 조회 1,220
15년 전 조회 1,220
15년 전 조회 1,085
15년 전 조회 984
15년 전 조회 922
15년 전 조회 1,281
15년 전 조회 1,232
15년 전 조회 985
15년 전 조회 953
15년 전 조회 1,136
15년 전 조회 1,591
15년 전 조회 1,121
15년 전 조회 1,447
15년 전 조회 1,288
15년 전 조회 1,958
15년 전 조회 3,020
15년 전 조회 2,365
15년 전 조회 961
15년 전 조회 1,968
15년 전 조회 2,161
15년 전 조회 1,459
15년 전 조회 1,421
15년 전 조회 2,687
15년 전 조회 2,582
15년 전 조회 5,572
15년 전 조회 1,531
15년 전 조회 4,295
15년 전 조회 1,426
15년 전 조회 1,724
15년 전 조회 1,690
15년 전 조회 1,682
15년 전 조회 1,184
15년 전 조회 1,429
15년 전 조회 1,559
15년 전 조회 1,484
15년 전 조회 2,199
15년 전 조회 1,342
15년 전 조회 1,410
15년 전 조회 963
15년 전 조회 1,055
15년 전 조회 1,025
15년 전 조회 976
15년 전 조회 932
15년 전 조회 995
15년 전 조회 1,141
15년 전 조회 1,156
15년 전 조회 2,687
15년 전 조회 1,006
15년 전 조회 1,660
15년 전 조회 1,528
15년 전 조회 1,657
15년 전 조회 1,356
15년 전 조회 1,853
15년 전 조회 671
15년 전 조회 1,149
15년 전 조회 1,119
15년 전 조회 2,901
15년 전 조회 3,227
15년 전 조회 1,897
15년 전 조회 1,413
15년 전 조회 2,023
15년 전 조회 1,533
15년 전 조회 1,128
15년 전 조회 3,819
15년 전 조회 1,472
15년 전 조회 1,570
15년 전 조회 2,793
15년 전 조회 1,492
15년 전 조회 4,216
15년 전 조회 2,429
15년 전 조회 3,213
15년 전 조회 1,821
15년 전 조회 2,054
15년 전 조회 1,358
15년 전 조회 4,432
15년 전 조회 4,011
15년 전 조회 3,836
15년 전 조회 5,255
15년 전 조회 3,481
15년 전 조회 1,865
15년 전 조회 1,810
15년 전 조회 1,951
15년 전 조회 1,652
15년 전 조회 4,050
15년 전 조회 2,977
15년 전 조회 2,145
16년 전 조회 1,731
16년 전 조회 1,963
16년 전 조회 2,449
16년 전 조회 1,523
16년 전 조회 2,452
16년 전 조회 1,791
16년 전 조회 1,894
16년 전 조회 1,538
16년 전 조회 2,239
16년 전 조회 1,568
16년 전 조회 1,982