seohyun han

Ajax - 비동기 자바스크립트와 XML의 약자 - 자바스크립트를 이용해 서버와 비동기 방식의 통신을 해서 웹 페이지를 갱신하지 않은 채로 여러 가지 작업을 수행하는 프로그래밍모델 동기적 - 하나의 작업이 완료된 후에만 다음 작업을 진행할 수 있는 구조 (응답이 올때까지 기다려야 함) 전통적인 경우 - 하나의 완전한 HTML 을 반환하는 형태 비동기적 - 사용자는 요청에 대한 응답이 돌아오지 않은 상태이더라도, 기다림 없이 다른 작업을 진행할 수가 있음 하나의 작업이 완료되지 않은 상태에서도 다른 작업을 얼마든지 시작할 수 있는 구조 XMLHTTPRequest 가 중간에서 통신을 담당한다. - 기존에는 웹브라우저가 웹서버와 통신 => XMLHttp 객체가 웹서버와 통신 더보기 클라이언트 => 서버 => ..

function target02(){ $("#target02 span").text("변경"); } $(selector).text(value); : 값넣기 function target06(){ //$(".target06 input:checkbox").removeAttr("checked"); $(".target06 input:checkbox").prop("checked", false); } .prop() 지정한 선택자를 가진 첫 번째 요소의 속성값을 가져오거나 속성값을 추가함 function target08(){ $(".target08 select option").eq(1).attr("selected","selected"); } attr( name, value ) : 선택한 요소에 속성을 추가함 functi..

※ 탐색(Traversing) 메서드 - 개체를 찾거나 필터하는 작업은 대부분 셀렉터를 통해서 이루어지지만, 1차적으로 셀렉터를 통해서 필터링을 하고 난 다음에, 그 결과 집합 내에서 추가적으로 필터링하거나, 추가 탐색하거나, 다른 결과 집합과 합치거나 하는 등의 작 업을 하기 위해서는 트래버스 메서드가 유용하게 사용됨 ▶ 추가 필터링 관련 메서드 $(document).ready(function(){ $('tr:first').css('font-style','italic'); $('tr:even').css('font-size','25px'); $('tr:eq(1)').css('color','orange'); $('tr:gt(4)').css('color','blue').css('font-weight','bo..

※ 문서객체조작 - 조작관련메서드 : 요소에 값을 지정하거나, 특정 요소의 값을 읽어오거나, 동적으로 요소 자체를 생성, 삭제, 복사, 제거하는 기능 들 ▶ $( ) ▷ $(html태그) - 문서 객체를 생성한다 - 인자로 html 태그를 지정한 경우에는 동적으로 그 요소를 생성함 $("(클릭)").appendTo("b"); = > (클릭)라는 태그 문자열을 동적으로 생성한 뒤, 그를 모든 b 태그의 뒤에 덧붙임 ▷ $('선택자') - 문서 객체를 선택한다 - 인자로 선택자를 지정한 경우에는 일치되는 모든 요소를 찾음 $("#linkText") = > #linkText라는 선택자에 일치하는 요소들을 검 html() / text() - 요소의 내용을 다루는 메소드 ▶ html() - 사잇값 + 태그까지 가..

※ jquery ▶ javascript = > jquery를 사용하는 이유 - javascript 1. 클릭하면 사라짐 = inline 으로 함수가 연결되어있는데, 이건 좋은 코드가 아니다. javascript 로도 완전히 분리된 코드를 짤 수 있지만, 코드가 너무 길어진다. - jquery $(document).ready(function(){ //페이지가 로드되면 내부의 것을 실행해라 $('div').click(function(){ // 이벤트핸들러 $(this).hide(); // 이벤트핸들러안에서의 this : 이벤트가 발생한 객체 }); }); = 위와 동일한 작업을 수행하지만 완전히 분리되어있고, 코드도 간결하다 ▶ jquery 사용하기위한 셋팅 : jquery 라이브러리를 넣고 경로 맞추기 s..