[항해99:사전교육](웹개발종합)2주차 교육일지 jQuery기초,ajax기초

자바스크립트는 화면의 움직임을 가능하게 해준다

하지만 자바스크립트만으로는 충분하지 않다

버튼의 색을 바꿔준다거나div박스하나를 감춘다거나

이런것들을 편하게 해주기위해서 필요한것이 'jquery'이다

 

jquery는 위에것들을 쉽게할수있게 미리 짜놓은 자바스크립트 라이브러리

 

css에서 뭔가를 적용시켜주기위해 class로 이름을 정해준것처럼

jQuery에서는 id라는것을 사용한다

 

사용하는방법은

$('#지정해준 아이디').val()

지정해준 아이디에 val()을 적용시키고싶다.  라는 뜻이다

*val()는 지정해준 아이디에 있는 값을 가져오는것 

$표시는 jQuery라는것을 말해준다

$(선택자).동작함수()

 

예)<input>테그를 통해서 입력된 데이터 등을 가져와서 변수에 넣어줄수있다

let input_data = $('#input-data').val()이런식으로 사용가능

 

자바스크립트만을 쓰면 아래처럼 복잡해진다

document.getElementById("element").style.display = "none";

 

 

ajax를 사용하면 서버에 들어가서 데이터들에 접근을 할수있다.

 

사용방법

$.ajax({

     type:"GET",
     url:"이곳에url입력",
     data:{}
     success:function(response){
         console.log(response["seoul"]["city'")    <!--리스폰스가 JSON파일이라서 딕셔너리를 학인하는 방법으로 원하는 데이터를 가져올수잇다-->

     }

})

이게 기본 뼈대이다 저것을 자바스크립트 합수 안에 넣어줄수있다.

저 success안의 function안에 jQuery를 넣어줘서 같이 사용할수도있다.

 

저 url의 주소에있는 서버에 접근해서 response객체를 받아온다

 

$.ajax({

     type:"GET",

     url:"이곳에url입력",

     data:{}

     success:function(resopnse){

                      $('#id').hide()         

     }

})

이런식으로 써줄수있다