javascript & jquery 이해
core란?
- Core란 jQuery의 핵심이 되는 것을 의미한다 .
html 요소 로딩 전까지 실행을 기다리는 jqeury 구조
$(document).ready() 또는 $(function() {})는 페이지의 HTML DOM이 모두 로드가 되면 실행이 되는 함수로 자바스크립트의 onload 메서드의 확장된 역할을 하고 있습니다.
jQuery를 사용하실 경우 onload 이벤트의 사용보다 $(document).ready() 또는 $(function() {})를 사용하시길 적극 추천한다.
- 원리 : html요소를 코드가 작성된 순서대로 처리한다. .js 파일이 상단에 있으면, 브라우저는 아직 head 요소의 일부만 인식하므로 (이후 html 요소는 아직 인식하지 않으므로) 파일 내용을 실행할 수 없다.
- 방법 : 그러므로, $(function() {}); 안에 작성한 내용을 일단 예약한 상태로 두고, html요소를 끝까지 읽어들인 시점에 처리 내용을 실행한다.
점과 세미콜론의 역할
- 점(.) :으로 jquery 객체와 jquery 메서드를 이어준다.
- javascrkpt에서 하나의 명령 작성이 끝나면 세미콜론을 표기한다.
tip
- 현재 지정된 속성값을 검색하는 방법
$(function(){
$('#typo').css('color');
})
// id가 typo인 css의 color 속성을 검색한다.
- 여러가지 속성값을 한꺼번에 변경
$(function(){
$('#typo').css('color', '#5e6577');
$('#typo').css('background-color','#50576b');
$('#typo').css('font-size','50px');
});
$(function(){
$('#typo').css({
color : '#5e6577' ,
backgroundColor : '#ae539b' ,
fontSize : '50px',
});
});
* 속성코드에서 따옴표를 생략할 수 있다. -(하이픈)을 빼고, 하이픈 뒤 시작문자를 대문자로 표기
-
'JAVASCRIPT & J-QUERY' 카테고리의 다른 글
조건문 (0) | 2018.06.14 |
---|---|
슬라이드 ,간단한 swiper 사용 (0) | 2018.06.11 |
제이쿼리 버전 차이 (0) | 2018.03.13 |
라이브러리, 플러그인, 함수, 확장 라이브러리의 차이점 (0) | 2018.03.09 |
크로스 브라우징을 위한 HTML5 shiv와 IE checker (0) | 2018.02.08 |