보통 html 문서를 컴파일할 때 css 파일이 있는 경우 이 파일 역시 컴파일 된다.

그리고나서 jQuery 를 이용해 어떤 html code를 삽입을 했는데 이미 css 파일이

한번 읽혀졌기 때문에 이 html code의 style은 정말 찾아볼수 없을 정도로 안 예쁘다. (필자의 경우 확 짜증이 난다)


이럴 때 html code를 한 뒤,

이 code를 가리킨만한 selector를 이용해 

$('selector').css(propertyName, value); 

요런 식으로 style을 입힐 수 있다. - 깨닫고 나서 엄청 감동먹음orz

value 말고도 function(index, value) 함수도 가능한듯. (자세한 예제는 http://api.jquery.com/css/ - only 영어)


꼭 이런 경우가 아니더라도 어떤 event가 발생했을 때 style을 바꾸는 아주 단순한 경우에도 쓰인다.ㅎㅎ

(예를 들어 버튼을 클릭했더니 글씨가 커진다던가, 배경색이 바뀐다던가 등)


뭔가 아리송한 건 .css(map) 인데 자세한 예제도, 설명도 없는 것 같아서 일단 PASS -



그리고... 내게 신세계를 열어준 jQueryUI (http://jqueryui.com/) .......

솔직히 UI API 라는 게 굉장히.. 뭐랄까 편리하면서도 제한적이라 좀 찜찜하지만 overwrite 가능하니까

결론은 편리하고 예.... 예뻐~~~~~ 흐흐흐


아코디언 타입의 메뉴 펼침 같은 경우 요렇게. 그 외에 많은 UI를 지원해서 한번 맛들리면 

직접 수작업하기 매우 귀찮아지는 경향이 생긴다는게 단점이랄까.


사이트 들어가서 요리조리 해봤는데 확실히 UI 사이트라 그런지 http://www.w3schools.com/ 보다 

훨씬 Test 하기도편한 것 같고 아기자기(색상, 폰트, 형태 등 전체적으로) 하면서도 예제 코드도 보기 잘해놨당 :D


jQuery 기본기도 없는 상태에서 코드가 굉장히 정신없어서.. 솔직히 처음엔 좀 많이 회의적이었는데

이렇게 또 써보니까 조금씩 재미를 붙이고 있다 ㅋㅋㅋ 한번 시도해 볼 가치가 있는 듯 하다.

게다가 지금 Node.js (한빛미디어) 책을 보고 있는데 온통 jQuery 코드라서 이해하려면 필수인듯 orz


'Programming' 카테고리의 다른 글

Delegate (대리자)  (1) 2013.12.20
[Python, C#]Lambda Form  (0) 2013.12.19
PHP vs. Ruby vs. Python  (0) 2013.12.19
HTML5 Canvas Element 를 사용할 때 주의할점 - drawImage() 관련  (2) 2013.01.11
jQuery : val(), text(), html()의 차이  (2) 2013.01.02
by kelicia 2013. 1. 2. 06:05