본문 바로가기

프로그래밍/JavaScript & jQuery

[jQuery] 정리 잘 되어 있는 곳 http://findfun.tistory.com/category/jQuery
[JavaScript] 동적 로딩 Dynamic Script Loading 동적으로 자바스크립트를 로딩하는 방법 중 하나는 script 태그를 자바스크립트 코드에서 직접 생성하는 것인데요. 다음과 같이 script 태그를 생성하고 src에 로딩할 주소를 넣음으로서 로딩하게 됩니다. ? 1 2 3 4 5 var head= document.getElementsByTagName('head')[0]; var script= document.createElement('script'); script.type= 'text/javascript'; script.src= 'helper.js'; head.appendChild(script) 위의 코드를 실행함으로서 스크립트 파일을 로딩을 할 수는 있지만, 스크립트가 로딩이 완료되어서 사용할 수 있는 지 여부를..
[JavaScript]RegExp 정규 표현 객체 정규 표현 객체 생성 기본형 var 참조 변수 = new RegExp(패턴, 검색 옵션) var 참조 변수 = /패턴/검색 옵션 정규 표현 메서드 test() : 지정된 규칙에 맞는 단어가 있으면 true 값을 반환한다. exec() : 지정된 규칙에 맞는 단어가 있으면 해당 단어를 반환한다. //이름 reg1 = /^[가-힣]{2,5}$/; //휴대폰번호 reg2 = /^(010|016|011)\d{3,4}\d{4}$/; //이메일 reg3 = /^\w{5,12}@[a-z]{2,10}[\.][a-z]{2,3}[\.]?[a-z]{0,2}$/; 정규 표현 검색 옵션 종류 설명 * 0회 이상 일치하는 문자를 검사할 때 사용한다 + 1회 이상 일치하는 문자를 검사할 때 사용한다 i 찾는 문자가 영문일 경우 대..
Array 배열 splice(), slice(index1,index2) 메소드 splice() : 배열 객체의 지정 데이터를 삭제하고 그 구간에 새 데이터를 삽입할 수 있다. slice() : 배열 객체의 데이터 중 원하는 인덱스 구간 만큼 잘라서 배열 객체로 가져 온다. var str="hello javascript"; str.slice(3,7) :=> "lo j" var str = new Array("h", "e", "l", "l", "o", " ","j","a","v","a","s","c","r","i","p","t"); document.write(str.join("")," "); //hello javascript str.splice(0,5,"Hi"); document.write(str.join("")," "); //Hi javascript
자바스크립트에서 당장 사용해야 할 5가지의 배열 메소드들 배열 메소드 들중에.. 평소에 잘 사용하지 않지만, 사용하면 생산성이 많이 올라가는 메소드 들이다. 하지만 다시 리마인드 하는 의미로 정리하면, 도움이 될것 같다. 익숙한놈도 있고.. 초기에 JS 공부할때 알아뒀지만, 한번도 안써봤던,,(reduce) 같은 놈들은 다시 보니 어색 하기도 하고. 이번기회에 정리를 해보자 아래는 이 포스팅의 원문이 되는 블로그 http://colintoh.com/blog/5-array-methods-that-you-should-use-today?utm_source=javascriptweekly&utm_medium=email 1. 배열에서특정값이 있는지 찾을때는 indexOf를 사용해라 대부분의 배열에서 indexOf 를 사용 하지 않으면, for loop 를 돌려서 찾을수 ..
JSDT JQuery 설정 JSDT JQuery 설정방법입니다. 요즘블로그에는 이클립스 마켓플레이스를 통해 설치하는 편한방법이 있는데 그방법으로 안되시는분들을 위해 준비 했습니다. 저도 겨우겨우 찾았거든요... 그만큼 마켓플레이스로 들어가서 설치하는방법 밖에는 없더라구요 ... 마켓플레이스 접속안되는거..해결할방법있음 저도좀 가르쳐 주세요 흑흑;; ///////////////////////// 하는방법 소개입니다. 1. Help 들어가서 > install New SoftWare.... 들어갑니다 2. Add.. 선택하신다음에 Name 에는 Jquery 입력해주시고 Location 에는 http://svn.codespot.com/a/eclipselabs.org/jsdt-jquery/updatesite 이 주소 넣어주세요 3. 저는 ..
[JavaScript]각 form의 element(요소)에 접근 방법 form의 element에 스크립트로 접근하는 방식들을 정리해보았다. 각 브라우저별로 테스트 했으니 참고 하면 된다. IE : 익스플로러 7 SF : 사파리 3 FF : FireFox 3 Chrome : 크롬 1. form의 element에 name으로 접근 접근 방법 실행 브라우저 document.form1.txt1.value IE, SF, FF, Chrome document.getElementsByName('txt1')[0].value IE, SF, FF, Chrome document.getElementsByTagName('input').item('txt1',0).value IE, SF, FF, Chrome document.getElementById('txt1').value IE document.fo..
자바스크립트 이벤트 종류와 이벤트리스너 (1) 자바스크립트 이벤트리스너 표준브라우저와 IE의 이벤트리스너는 다르기 때문에 크로스브라우징을 고려해야한다. 표준브라우저와 IE11은 addEventListener()메소드, IE10 ~ IE9는 addEventListener(), attachEvent()둘다 지원한다. IE8이하는 attachEvent()메소드를 사용한다. ① 표준브라우저에서 이벤트리스너 아래는 이벤트 실행시, 정의된 함수를 실행하는 코드 – 첫번째 매개변수는 이벤트, 두번째 매개변수는 함수 JavaScript btn.addEventListener('click', testFunc); 1 btn.addEventListener('click', testFunc); 아래는 이벤트 실행시, 익명함수를 실행하는 코드 – 첫번째 매개변수는 이벤..

티스토리툴바