| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
- flex3
- Node.js
- 명사 분석기
- Cross
- nodejs express
- 메일왕창보내는법
- 나의 취미
- ajax
- php thumbnail
- Eclipse
- 디즈니씨
- iBatis
- 주식이야기
- C/C++
- Lift
- 스킨 스쿠버
- node.js web framework
- 명사 추출기
- 도커
- express for node.js
- php
- scala
- 책이야기
- docker
- 나의 프로젝트
- rss
- ror실행
- 명사 뽑아내기
- 베트남어
- ejb
- Today
- Total
nkdk의 세상
나도 해보자 ＪＱＵＥＲＹ ［ 시작하며．． ］ 본문
이번에 경험 삼아 하게 되서.. 자료 정리겸 시작하려 한다.
일단 Jquery의 목적은 자바스크립트를 편하게 쓰는데 있고.. 또한 여러가지 지원 라이브러리를 보면서 간단히 제작이 가능하다는 것이다. 물론 모든 언어가 그렇듯이 처음에는 버벅이지만, 배워 두게 되면 엄청난 효율성에 놀랄 것이다.
기본적으로 장점으로는 역시 규모가 커지든 작아지든 어디서나 적용할 수 있다는 점과 코드가 직관적으로 읽기 쉽다는 점이다. 그럼 간단히 시작해 보자.
예제를 하나 보겠다.
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('div#buts').each(function(i){ // <-divの中でbutsのIDをeach(for)する.functionのiは0->sizeまで
$(this).click(function(){ // clickする時のエベント登録
$('input#inps').each(function(i2) { // inputboxのinpsのIDをeach(for)する.functionのiは0->sizeまで
if(i2 == i) { // <-clickしたボタンの番号とinputboxの番号が同じ場合処理する.
$(this).val('changed'); // <-inputboxにchanged値を入れる
}
});});});});
</script>
</head><body>
<div id="buts" name="buts">asd</div>
<div id="buts" name="buts">asd</div>
<div id="buts" name="buts">asd</div>
<input type="text" id="inps" name="inps" value="inputs">
<input type="text" id="inps" name="inps" value="inputs">
<input type="text" id="inps" name="inps" value="inputs">
<div id="adddiv"></div></body></html>
위에 코드는 현재 본인이 일본에서 일을 하고 있기 때문에 일본어로 커맨트를 달아놨다. 이해해 주기 바란다. 한국어로 또 바꾸는 것도 걸리기는 걸리는 시간이다. ^^; 사실 나만 알아보면 됐지라는 괴박한 생각때문이 아닐까 한다. ^^
위에 코드는 정말 간단한 예이다. 이외에도 ajax통신 혹은 html심기등이나 여러가지 테이블에 관련된 라이브러리 등 종류가 참 다양하다. 앞으로 발견하게 되는 내용이 있으면 기재 하도록 한다. 오늘은 끝 ^^