'Web/JQuery'에 해당되는 글 4건

  1. 2013.02.06 jQuery 배열과 객체 사용 1
  2. 2013.01.31 jQuery를 시작하자~ 1
  3. 2013.01.29 셀렉터(Selector) 기초
  4. 2013.01.21 처음 강좌(?)를 시작하며...

jQuery 배열과 객체 사용

Posted by 알 수 없는 사용자 Web/JQuery : 2013. 2. 6. 16:11


1. 배열 생성

방법 i. new 생성자를 이용하여 배열 요소안에 값을 각각 초기화.

          var arr = new Array();

          arr[0] = "hi";

          arr[1] = "hello";

          arr[2] = 1000;


방법 ii. new 생성자를 이용하여 배열 생성과 동시에 값을 초기화.

          var arr = new Array("hi", "hello", 1000);


방법 iii. [ ]연산자를 사용하여 값을 초기화

          var arr = ["hi", "hello", 1000];



2. 객체 생성

방법 i. new 생성자를 이용하여 객체 각각의 요소에 값을 초기화

          var obj = new Object();

          obj.data = 1024;

          obj.str =  "hello";

          obj.func = function(){ alert("This is function"); }


방법 ii. new 생성자를 이용하여 객체 생성과 동시에 값을 초기화

          var obj = new Object( {data:1024, str:"hello", func:function(){alert("This is function");} } );


방법 iii. 중괄호( {} ) 를 이용하여 값을 초기화

          var obj = { data:1024, str:"hello", func:function(){alert("This is function");} };




'Web > JQuery' 카테고리의 다른 글

jQuery를 시작하자~  (1) 2013.01.31
셀렉터(Selector) 기초  (0) 2013.01.29
처음 강좌(?)를 시작하며...  (0) 2013.01.21
  

jQuery를 시작하자~

Posted by 알 수 없는 사용자 Web/JQuery : 2013. 1. 31. 09:00


오늘은 jquery를 어떻게 구동하는지 포스팅 하겠습니다.ㅎ


제가 주로 쓰는 편집기는 메모장의 업그레이드판인 오픈소스 Notepad++ 을 사용합니다.


저는 오픈소스를 사랑하는 사람, 그리고 무료버전을 찾아헤매는 사람입니다. ㅎㅎㅎㅎ


그 외에도 Aptana Studio 라는 무료프로그램이 있습니다.(오픈소스는 아닙니다. ㅎ)


자 이제 시작해 볼께요. 구조는 다음과 같이 만들어서 메모장에서 [파일이름.html] 로 저장 합니다.


<html>

<head>

  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>

   $(document).ready(function(){

   $('button').click(function(){ alert("Clicked button")})

         });  

  </script>

</head>


<body>

 

<button>Click</button>


</body>

</html>



 <script src="http://code.jquery.com/jquery-latest.js"></script>

여기에 나와있는 주소 말고도 다른주소들이 많아요ㅎ 한번 찾아보세요ㅎ jquery를 사용하시기 위해서는 꼭 적어주셔야 되는 부분입니다. 


url 주소 말고도 직접 .js 파일을 다운받아서 사용하는 방법도 있어요.


1. 우선 http://jquery.com 으로 접속을 합니다.

2. 오른쪽 상단에 있는 Download jQuery 이미지를 클릭합니다.


3. 빨간색 박스로 만든 부분을 클릭하여 다운로드 합니다. 두개의 차이는 압축한거와 안한거의 차이라고 하는데 정확하게는 모르겠네요 ㅎ



4. 다운받은 파일을 제가 작업하고 있는 파일과 같은 폴더에 넣어줍니다.


5. 작업하시고 계신 파일에서 다음과 같이 고쳐줍니다. ㅎ

 <script src="jquery-1.9.0.js"></script>


그러면 따로 인터넷이 되지 않아도 jquery를 사용할 수 있어요 ㅎ 


허접하지만 제가 알고 있는 지식은 여기 까지 입니다 ㅎㅎ


오늘 포스팅은 여기서 끝 ㅋㅋ

  


'Web > JQuery' 카테고리의 다른 글

jQuery 배열과 객체 사용  (1) 2013.02.06
셀렉터(Selector) 기초  (0) 2013.01.29
처음 강좌(?)를 시작하며...  (0) 2013.01.21
  

셀렉터(Selector) 기초

Posted by 알 수 없는 사용자 Web/JQuery : 2013. 1. 29. 15:46

오늘은 셀렉터 기초에 대해 알아보도록 하겠습니다.

간단하게만 포스팅 할께요 ㅎ


<html>

<body>

   <button id="btn_id" class="btn_class" name="btn_name">Click 1</button>

   <button class="btn_class">Click 2</button>

   <button name="btn_name">Click 3</button>

</body>

</html>


ID로 찾기 (identity의 약어인거 아시죠? 같은 id를 쓸 수 없습니다.)

<script>

   $(document).ready(function(){

      $('#btn_id').click(clickBtn);          //같은 표현 $('[id=btn_id]')

   });


   function clickBtn(){

      alert("ID");

   }

</script>


[결과]



* Click 2, Click 3 을 눌렀을 때에는 아무 반응을 하지 않습니다.



Class로 찾기 (btn_class 라는 이름을 가진 클래스를 모두 찾습니다.)

<script>

   $(document).ready(function(){

      $('.btn_class').click(clickBtn);    //같은 표현 $('[class=btn_class]')

   });                                                 //                 $('button.btn_class')


   function clickBtn(){

      alert("Class.");

   }

</script>


[결과]



* Click 3 을 눌렀을 때에는 아무 반응을 하지 않습니다.




Name으로 찾기 (btn_name 라는 이름을 가진 클래스를 모두 찾습니다.)

<script>

   $(document).ready(function(){

      $('[name=btn_name]').click(clickBtn);    

   });


   function clickBtn(){

      alert("Name");

   }

</script>


[결과]



* Click 2 를 눌렀을 때에는 아무 반응을 하지 않습니다.


   


'Web > JQuery' 카테고리의 다른 글

jQuery 배열과 객체 사용  (1) 2013.02.06
jQuery를 시작하자~  (1) 2013.01.31
처음 강좌(?)를 시작하며...  (0) 2013.01.21
  

처음 강좌(?)를 시작하며...

Posted by 알 수 없는 사용자 Web/JQuery : 2013. 1. 21. 20:04

안녕하세요 필자 카일 입니다.


필자는 임베디드 관련 분야에서 근무를 하다 웹으로 넘어오게 되었습니다.


C/C++ 을 다루던 저에게 웹 프로그래밍은 간단하다고 생각했지만 상당히 어려운 분야였습니다. 


Jquery 라는 낯선 언어를 보고 공부하기 위해 여기저기 사이트를 둘러보았지만 제대로 된 공부를 하지 못하였습니다. 


아직도 웹 프로그래밍을 잘하지 못하는 저는 하루하루 공부하며 이 강의를 시작하려고 합니다.


부족한 부분이 있다면 지적해 주시고 항상 처음 하는 사람의 관점에서 이해하기 쉽도록 써내려가겠습니다^^*

'Web > JQuery' 카테고리의 다른 글

jQuery 배열과 객체 사용  (1) 2013.02.06
jQuery를 시작하자~  (1) 2013.01.31
셀렉터(Selector) 기초  (0) 2013.01.29
  
 «이전 1  다음»

티스토리툴바