Life goes slowly...

요소(element)에 자바스크립트(Javascript) 이벤트 핸들러를 지정하기 위한 함수로는. bind() , .on(), .live() 가 있습니다. 3개의 함수 모두 같은 역할을 하고 있지만 각각 함수마다 차이점이 있습니다. jQuery의 .bind() 함수 제이쿼리(jQuery)에서 사용되는 가장 기본적으로 사용되는 자바스크립트(Javascript) 이벤트 바인딩 함수입니다. 하지만 제이쿼리 1.7 버전 이후에. on() 함수가 나오면서 새로운 기능이 추가되지 않을 예정으로 점점 사라질 수도 있다는 이야기가 있어서 제이쿼리 1.7버전 이후에는. on() 함수를 사용하라고 가이드 되어 있습니다. 단일 요소(element)를 각 이벤트 처리기에 연결하며 복제된 요소(element)는. bind() ..

jQuery의 .removeAttr() 함수 jQuery의 .removeAttr() 함수는 속성을 값을 삭제할 때 사용됩니다. 자바스크립트의 기본 함수이며 요소(element)의 속성(attribbute)의 값을 삭제할 때 사용됩니다. // 속성값 제거하기 .removeAttr( attributeName ) .removeAttribute( attributeName ) // div 요소의 title 속성을 제거합니다. $( 'div' ).removeAttr( 'title' ); // input 요소의 placeholder 속성을 제거합니다. $( 'input' ).removeAttr( 'placeholder' ); // input 요소의 disabled 속성을 제거합니다. $( 'input' ).remov..

자바스크립트(Javascript)의 Location 객체 자바스크립트의 Location 객체는 window 객체의 하위 객체이지만 window 객체를 생략하며서 사용이 가능합니다. 프레임을 사용되는 경우에는 최상위 프레임 문서의 URL만 참조할 수 있고, 하위 프레임의 문서들은 프레임 객체를 이용하기도 합니다. //기본형태 location.속성 또는 메소드 location.속성 = 지정값; 자바스크립트(Javascript)의 location.href 자바스크립트의 location.href는 페이지의 URL 전체 정보를 반환하는 함수로써 URL을 지정하여 페이지를 이동할 수 있습니다. 형태는 속성으로서 주소 히스토리가 기록됩니다. location.href는 location 객체에 속해있는 프로퍼티로 현재 ..

JavaScript(자바스크립트)에서 대화상자로 사용되는 함수들은 많이 있습니다. Alert, Confirm, Prompt 세 가지가 있고 새롭게 Popup 창을 띄우는 형태로써는 모두 같지만 각각 함수마다 역할이 다르며 함수 사용방법이 다릅니다. 자바스크립트 Alert() 함수 자바스크립트의 Alert() 함수는 단순하게 메시지만을 전달하는 함수이며 사용된 후에 반환되는 값은 없습니다. 대부분 사용자에게 경고하는 내용이나 중요한 내용을 전달할 때 사용되는 함수입니다. 대화상자 Popup 창중에 가장 기본적이며 많이 사용되는 함수입니다. alert("Hello World"); 자바스크립트 Confirm() 함수 자바스크립트의 Confirm() 함수는 Alert() 함수와는 다르게 변수에 참/거짓을 저장한..

자바스크립트 Hoisting 자바스크립트의 호이스팅은 모든 선언(var, let, const, function)을 통해서 정의된 변수의 선언문을 유효범위의 최상단으로 끌어올리는 행위를 말합니다. 변수의 범위가 전역 범위, 함수 범위 상황에 따라서 다르게 동작이 되며, 변수의 선언과 할당의 분리라고도 합니다. 전역 범위(globa scope) - 전역 범위에서는 스크립트 단위 최상단으로 끌어 올려집니다. 함수 범위(function scope) - 함수 범위에서는 해당 함수의 최상단으로 끌어 올려집니다. 자바스크립트 함수 표현식 (Function Expression) 자바스크립트에서 변수를 만들고 함수를 변수에 할당해 주는 표현식으로는 hoisting 안됩니다. test(); var test = functi..

자바스크립트 클로저(Closure) 클로저 = 함수 + 함수를 둘러싼 환경(Lexical environment) 클로저(Closure)는 독립적인 변수를 가리키는 함수라고 MDN 웹 문서 사이트에서는 정의되어 있습니다. 자바스크립트의 함수 내부에 함수를 작성을 할 때 그 내부에 생성된 함수를 클로저(Closure)라고 합니다. 차후에 외부 함수의 변수를 사용 가능하도록 하기 위해서 반환하여 사용하는 것이 대부분입니다. 자바스크립트의 클로저에는 세 가지 스코프가 있습니다. 지역내의 지역 범위 (Local Scope) 지역외의 외부 함수 범위 (Outer Functions Scope) 전체지역의 전역 범위 (Global Scope) 클로저(Closure)에 대해서 세 가지 범위, 스코프에 모두 접근은 가능하..

JavaScript의 Array(배열)은 자바스크립트에서 데이터를 처리할 때 가장 폭넓게 사용되고 있는 데이터의 타입 중 하나이며 손쉽게 배열을 추가하고 삭제를 하는 다양한 조작 함수들을 제공하고 있습니다. Javascript에서 배열(Array)에서 새로운 Value 값을 삭제할 때 사용하는 pop(), shift(), splice() 함수들이 잇습니다. 사용하는 함수에 따라서 배열의 앞이나 뒤에 삭제를 할 수 있습니다. JavaScript의 pop() 함수 JavaScript의 pop() 함수는 Array(배열)의 마지막에 새로운 요소를 삭제하고 난후 변경된 배열의 길이를 반환하는 함수입니다. Array(배열)의 끝에 Value 값을 삭제하는 함수입니다. Array(배열)의 끝에 하나 또는 그 이상의..

Javascript에서 사용자가 키보드의 key 입력을 감지하여 함수를 호출하여 처리가 가능합니다. onKeyDown(), onKeyUp() 함수를 호출 시 KeyCode를 함께 사용이 가능합니다. onKeyDown() 함수 Javascript 프로그래밍에서 물리키에 반응하는 함수로써 키보드의 Key를 눌렀을 때 발생하는 Event 함수입니다. shift, alt, controll, capslock 등의 모든 key에 동작시 반응하며 한영 변환 key나 한자 key 등의 특수키는 인식하지 못합니다. Event 발생 시 Keycode Value 값을 받게 됩니다. test.onkeydown = function(){ console.log(event.keyCode); }; onKeyUp() 함수 Javascr..

document.ondrag Javascript의 MouseEvent 중 하나이며 마우스 드래그시 발생하는 이벤트를 ondrags 이벤트라고 합니다. Drag me! document.ondragstart Javascript의 MouseEvent 중 하나이며 마우스 드래그를 시작할때 발생하는 이벤트를 ondragstart 이벤트라고 합니다. Drag me! document.ondragend Javascript의 MouseEvent 중 하나이며 마우스 드래그가 완료될때 발생하는 이벤트를 ondragend 이벤트라고 합니다. Drag me!

자바스크립트 setInterval() 함수 자바스크립트에서 일정한 시간 간격으로 작업을 수행하기 위한 함수입니다. 일정한 시간 간격으로 실행되면서 시간의 간격이 약간 오래 걸리는 문제가 발생할수도 있습니다. clearInterval() 함수를 사용하여 작업을 중지할 수 있습니다. setInterval(function, milliseconds, param1, param2, ...) setInterval(function(){ alert("Hello"); }, 3000); 자바스크립트 setTimeout() 함수 자바스크립트에서 일정한 시간 후에 작업을 한번 실행하는 함수입니다. 보통 재귀적 호출을 사용 하여 작업을 반복하게 됩니다. setInterval() 함수와는 다르게 지정된 타임을 기다리고 작업을 수행..

document.oncontextmenu MouseEvent 중 하나이며 마우스 오른쪽을 클릭시 발생하는 이벤트를 oncontextmenu 이벤트라고 합니다. oncontextmenu 이벤트는 모든 브라우져에서 지원되고 있으며 contextmenu는 Firefox에서 지원됩니다.

JSON (JavaScript Object Notation) 데이터 오브젝트를 전달하기 위해 텍스트를 사용하는 개방형 표준 포맷으로, 비동기 브라우저/서버 통신(Ajax)를 위해 XML를 대체하는 주요 데이터 포맷입니다. JavaScript에서 XML을 쓰기 어렵고 웹 개발 환경에서도 사용하기 편하도록 보완한 형식이 JSON입니다. 요즘은 스프링 부트와 스프링에서 XML의 장점과 JSON의 장점을 가지고 환경 파일에서 XML의 대체 형식으로 떠오르는 YAML(야믈)을 지원하고 있습니다. JavaScript 에서부터 파생되어 JavaScript 구문의 형식을 따르지만 독립적인 데이터형식 포맷이기 때문에 C, C++, Java, Python 등 다양한 프로그래밍 언에서 활용이 가능합니다. JSON.parse..