R+2

박박기초 2 : JavaScript

역시 파이참을 이용하였다.

자바스크립트(JavaScript)란?
브라우저가 알아들을수 있는 언어이며, 문법을 알아야 원하는 대로 동작을 수행할 수 있도록 할 수 있다.

html에서는 <script></script>안에 코드를 쓴다.

자바스크립트에서는 변수를 사용하게 되는데 예를 들면
$('#temp') 처럼 값을 담는 박스이고, 문자열은 ''로 묶는다. 변수 설정할 때, let!
***변수명은 남이 봐도 알아 보기 쉽게 짓는 것이 좋다!

함수 : 부르면 정해진 동작을 한다
return : 끝내고 값을 내주라는 뜻

조건문
&&=and
||=or
if, else 가 제일 많이 쓰임

반복문 : 헷갈림
For While

EX)

while (i) { }
for (begin; condition; step)
for (let i = 0; i < 3; i++) { }

JQuery

JQuery ; 미리 작성된 자바스크립트 코드
https://www.w3schools.com/jquery
에서 가져올 수 있다.

Ajax

Json viewer 크롬 확장프로그램을 다운로드하였다.

$(document).ready(function () {
$.ajax({
type: "GET",
url:
data: {},
success: function(response){
$('#').text(response[''])}
})
});

처럼 ajax를 불러와 사용한다.

주어진 딕셔너리를 잘 타고 들어갈 수 있게 하는 것이 중요.
get 요청 : 우리가 브라우저에서 엔터를 치는 행위 등

퀴즈&과제

고양이를 보자버튼을 누르면 사진이 계속 바뀌는 'jQuery 이미지태그 src 바꾸기'퀴즈를 진행했다.

최종코드는 아래

function q1() {

        $.ajax({
            type: "GET",
            url: "https://api.thecatapi.com/v1/images/search",
            data: {},
            success: function (response) {
            let imgurl = response[0]['url']
              $('#img-cat').attr("src",imgurl);
            }
        })
    }

시행착오

이미지 바꾸는 거
$("#img-cat").attr("src","imgurl");
라고 썼는데 안됨. 왜 그런가 봤더니 문제는
attr("src","imgurl"); 에 ""가 없었어야 됨
십분 버렸다..

기온 API를 가져와서 실시간 서울 온도를 현재기온에 표시하는 과제.

    $(document).ready(function () {
    $.ajax({
          type: "GET",
          url: "http://spartacodingclub.shop/sparta_api/weather/seoul",
          data: {},
          success: function(response){
              $('#temp').text(response['temp'])
            }
          })
    });

사용한 ajax 코드는 위와 같다.

총평

''/""/;/.등을 어디에 어떻게 써야하는지 모르겠다.
코드가 이해가 안된다고 하기 보다는, 저런게 난 좀 어렵다.
이 부분을 좀 정리해봐야 겠다