Jun's TID

우선 AJAX란, JavaScript의 라이브러리중 하나이며 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자이다. 브라우저가 가지고있는 XMLHttpRequest 객체를 이용해서 전체 페이지를 새로 고치지 않고도 페이지의 일부만을 위한 데이터를 로드하는 기법 이며, 쉽게 말하자면 자바스크립트를 통해서 서버에 데이터를 요청하는 것이다. 지금까지 공부한 jQuery 프레임워크에서 해당 비동기 통신을 지원하도록 ajax() 함수를 제공하기 때문에 해당 카테고리의 대부분의 예제는 jQuery를 사용하여 구현할 예정이다. 그럼 빠른 이해를 위해 간단한 기초 예제로, 비동기 통신을 이용하여 아이디 중복 확인 기능을 구현해보자. 1. 우선, 데이터를 보낼 html 쪽에..

load() 함수를 이용하면 원하는 페이지를 비동기 방식으로 해당 페이지에 로드할 수 있다. 바로 확인해보자. HTML읽어오기 버튼 보면, alert가 load 뒷부분에 작성되었지만, alert창이 나온 뒤에 로드되는 것을 확인할 수 있다.

jQuery 는 JS보다 좀 더 다양한 시각적 효과들을 좀 더 쉬운 방법으로 사용이 가능하다. 대표적으로 쓰이는 몇 가지 효과를 예제와 함께 알아보도록 하자 1. show & hide : show(), hide() 함수를 이용하면, 특정 요소를 보이거나 숨길 수 있으며, 괄호 내에 "slow", "fast", "수치" 등을 입력하여 show & hide 속도를 조절할 수 있다. 안녕하세요. 여기는 본문입니다. more... 또 만나요 2. fadeIn() & fadeOut(): 서서히 나타내기 & 서서히 사라지기 첫번째 영역 또 만나요 3. slideUp: 말 그대로 슬라이드하며 올라오거나 내려감 첫번째 영역 두번째 영역 4. animate() : 여러가지 효과를 동시에 map 형태로 적용 가능 안녕하세..

사실 jQuery를 사용하는 가장 큰 이유 중 하나가 바로 동적으로 어떤 요소를 추가하거나 삭제하기 편리하다는 점일 것이다. 이번 포스팅에서는 세상 편리하게 동적으로 html 요소를 추가하는 몇 가지 방법을 작성해보려고 한다. 바로 확인해보자. 1. append: 동적으로 html 태그를 추가하는 함수 1) 테이블 동적 추가 여기에 태그 추가 행 열 2) 특정 용어에 대해서 번호 붙이기 jQuery is a new kind of JavaScript Library jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interaction..

jQuery의 트래버싱은 요소 선택을 좀 더 편리하게, id 속성 값을 굳이 주지 않아도 부모나 자식 요소의 관계나 인덱싱을 통해 요소에 접근하는 방법이다. 바로 확인해보자. 1. n 번째 index C# ASP.NET jQuery jQuery1 jQuery1 2. 지정된 표현식 존재 여부 3. 지정된 표현식을 제외한 요소 가져오기 4. 방금 실행한 요소의 직전 요소 반환 JavaScript jQuery

jQuery는 다음과 같은 형식으로 특정 요소의 이벤트 속성과 이벤트를 bind로 묶어 이벤트를 처리할 수 있다. // 클릭 요소와 이벤트를 바인딩 $('#btn').bind("click", function() { alert("버튼 클릭!!"); }); 또한 unbind를 활용하여 다시 이벤트 등록을 해제할 수도 있다. 혹은 굳이 bind한 함수가 아니더라도, unbind를 활용하여 해제할 수 있다.

Selector를 활용하는 방법이야, 구현하려는 기능에 따라 셀 수도 없을만큼 많겠지만, 하나 하나를 따로 포스팅하면 글의 갯수가 좀 감당이 안될 거 같아서... 이번 포스팅에 input, select 등의 선택자를 제어하는 방법을 어느 정도 정리하려고 한다. 바로 들어가 보자. 1. input 제어 드롭다운리스트 멀티라인텍스트박스 버튼 2. text box 제어 아이디 : 아이디 : 3. 비밀번호 일치 여부 확인 암호 : 암호확인 : 암호를 입력하시오. 4. 드롭다운리스트 선택한 값 가져오기 C# ASP.NET Silverlight 혹은 다음과 같이 구현할 수도 있다. C# ASP.NET Silverlight

each() 함수는 마치 for문처럼 특정 요소를 만날 때마다 반복적으로 수행할 함수를 작성할 수 있는 함수이다. 이를 이용하여 특정 태그를 만날 때마다 index 번호를 해당 태그에 순차적으로 할당해줄 수 있다. 바로 예제를 확인해보자. C# ASP.NET Silverlight

form 태그 내 input, radio, select 등의 입력 값을 설정하거나 추출할 수 있다. 바로 설명과 함께 예제 코드를 보자. 1. 값 설정 텍스트박스 : 라디오버튼 : 남 여 드롭다운리스트 : JavaScript jQuery Prototype 2. 값 추출 텍스트박스 : 라디오버튼 : 남 여 드롭다운리스트 : JavaScript jQuery Prototype

jQuery 내에서 html() 함수를 통해 마치 JS의 innerHtml처럼 html 구문을 작성할 수 있는데, 마찬가지로 text() 함수를 이용하여 비슷한 동작을 수행할 수 있다. 둘의 차이점은 다음과 같다고 보면 된다. - text() : text => text - html() : text => text text() 함수는 조금 독특한 특징을 가지고 있는데, 바로 get과 set개념을 사용한다는 점이다. 즉, - ( ) 내에 어떤 값이 없을 경우 => get - ( ) 내에 어떤 값이 있을 경우 => set 와 같이 사용할 수 있다는 점이다. 1. get 안녕하세요. jQuery 반갑습니다. JavaScript 또 만나요. 언제요? 2. set 안녕하세요. jQuery 반갑습니다. JavaScri..