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

· 15년 전 · 2629

ㅇ 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,496
15년 전 조회 1,472
15년 전 조회 1,011
15년 전 조회 1,171
15년 전 조회 1,178
15년 전 조회 1,043
15년 전 조회 941
15년 전 조회 871
15년 전 조회 1,234
15년 전 조회 1,183
15년 전 조회 929
15년 전 조회 903
15년 전 조회 1,076
15년 전 조회 1,541
15년 전 조회 1,074
15년 전 조회 1,403
15년 전 조회 1,237
15년 전 조회 1,915
15년 전 조회 2,976
15년 전 조회 2,309
15년 전 조회 904
15년 전 조회 1,918
15년 전 조회 2,104
15년 전 조회 1,406
15년 전 조회 1,379
15년 전 조회 2,647
15년 전 조회 2,532
15년 전 조회 5,518
15년 전 조회 1,485
15년 전 조회 4,245
15년 전 조회 1,378
15년 전 조회 1,675
15년 전 조회 1,642
15년 전 조회 1,630
15년 전 조회 1,131
15년 전 조회 1,380
15년 전 조회 1,519
15년 전 조회 1,430
15년 전 조회 2,152
15년 전 조회 1,295
15년 전 조회 1,352
15년 전 조회 906
15년 전 조회 1,007
15년 전 조회 977
15년 전 조회 940
15년 전 조회 889
15년 전 조회 954
15년 전 조회 1,096
15년 전 조회 1,107
15년 전 조회 2,630
15년 전 조회 959
15년 전 조회 1,609
15년 전 조회 1,482
15년 전 조회 1,610
15년 전 조회 1,308
15년 전 조회 1,800
15년 전 조회 617
15년 전 조회 1,107
15년 전 조회 1,072
15년 전 조회 2,865
15년 전 조회 3,182
15년 전 조회 1,855
15년 전 조회 1,368
15년 전 조회 1,986
15년 전 조회 1,485
15년 전 조회 1,089
15년 전 조회 3,781
15년 전 조회 1,432
15년 전 조회 1,522
15년 전 조회 2,754
15년 전 조회 1,447
15년 전 조회 4,174
15년 전 조회 2,388
15년 전 조회 3,169
15년 전 조회 1,781
15년 전 조회 2,009
15년 전 조회 1,311
15년 전 조회 4,390
15년 전 조회 3,971
15년 전 조회 3,789
15년 전 조회 5,209
15년 전 조회 3,426
15년 전 조회 1,809
15년 전 조회 1,764
15년 전 조회 1,917
15년 전 조회 1,604
15년 전 조회 4,008
15년 전 조회 2,922
15년 전 조회 2,101
15년 전 조회 1,682
15년 전 조회 1,916
15년 전 조회 2,400
15년 전 조회 1,483
15년 전 조회 2,415
16년 전 조회 1,749
16년 전 조회 1,848
16년 전 조회 1,496
16년 전 조회 2,188
16년 전 조회 1,524
16년 전 조회 1,934