Today I Learned

요소 추가 append() - 제일 많이 사용 - html은 덮어쓰기, append는 추가 - 선택한 요소 안 마지막에 추가된다. - 자식요소의 마지막에 추가 $("#apnd").on("click",function(){ i++; $("ol").append('LIST ITEM' + i + ''); }); prepend() - 선택한 요소의 자식요소의 처음에/위에 추가됨 $("#ppnd").on("click",function(){ i++; $("ol").prepend('LIST ITEM' + i + ''); }); after() - 선택한 요소의 동일선상에서 바로 뒤에 추가됨 //after - ol태그랑 동일선상에 뒤로 붙음 $("#aft").on("click",function(){ i++; $("ol")...

css() //선택한 요소의 스타일 값을 받아 온다. $("#ex1").css("color"); //선택한 요소의 스타일 값을 변경한다. //하나의 속성에 하나의 값만 들어갈 수 있다. - 코드 길어짐 $("#ex2").css("color":color); $("#ex2").css("font-size":size); //자바스크립트는 여러가지 데이터가 들어갈 때 배열,object(key:value) //아래처럼 오브젝트 형태로 하면 여러 속성을 넣을 수 있다 - 나중에 속성을 추가해야할 때 편함 //$(selector).css({ , , ... }); $("#ex2").css({ "color":color, "font-size":size }); 간단하게 css 추가할 때 씀 보통 css에 지정하는 속성이 너무..

attribute 가져오기 attr(), val(), text(), html() Val()과 attr()의 차이 - 특정한 값을 가지고 올 때 val - 특졍한 속성의 값을 가지고 올 때 attr console.log($("input[type='text']")); //타입이라는 속성의 값 가져오기 var type = $("input[type='text']").attr('type'); console.log(type); //text //value 속성의 값 가져오기 var val = $("input[type='text']").val(); //value 속성의 값 가져오기 console.log(val); //some text html()과 text()의 차이 공통점 : 태그와 태그 사이의 값 차이점 : 내부 ..

Event 등록 - 직접 등록 $(selector).click(function); -On을 통한 등록 (사용 권고) $(selector).on(“click”, function); : 특정한 요소를 가져와서 이벤트를 준다 - 이런 방법으로 계속 쓰이는 것 event 종류 click() : 클릭 시 발생 (눌렀다 뗀거) dblclick() : 더블 클릭 시 발생 mouseenter() : 마우스가 특정 영역으로 들어왔을 경우 발생 mouseleave() : 마우스가 특정 영역 밖으로 나갔을 경우 발생 mousedown() : 마우스 버튼을 눌렀을 경우 발생 (누른상태) mouseup() : 마우스 버튼을 뗐을 때 발생 hover() : 마우스 오버시 발생(mouseenter + mouseleave) focu..

jQuery JavaScript의 라이브러리 자바스크립트를 쉽게 쓰기 위해서 사용 J-QUERY는 css의 selector 의 기능을 차용해서, 원하느 요소를 쉽게 가져올 수 있음 자바스크립트나 제이쿼리나 html요소를 가져와서 속성을 바꿔줌 jQuery를 사용하는 이유? 1. 사용의 편리성 2.cross browsing : 자바는 jdk 설치해서 해석기가 있어서 쓸 수 있었는데 , 자바스크립트는 해석기가 브라우저에 붙여있는 방식. 브라우저 종류라 버전마다 표현이 다른데, jQuery는 내부적으로 브라우저마다 처리를 해놓아서 신경 쓸 필요가 없음 3. 다양한 플로그인 : J-QUERY를 기초로 한 부트스트랩 등이 있음 jQuery 시작하기 전에 1.Study - jQuery 폴더 만듦 2.확장 - Ope..