Week I learned 2주차

개발일지 1주 차에 이어 벌써 2주 차의 강의를 마쳤다.

기간은 2/24~2/25일

1주 차 2주 차로 나누는 기준은 강의 커리큘럼에 나와있는

진도표를 표준으로 삼았다.

 

이번 2주 차에서는 Ajax를 주로 다뤘다.

 

Ajax란?

Asynchronous JavaScript And XML의 약자로

HTML을 이용하여 웹서버에서 데이터를 요청하는 등

웹페이지와 자유롭게 상호작용 할 수 있다.

 

또한, 

XMLHttpRequest(XHR) 개체 JavaScript와

HTML DOM(데이터를 표시하거나 사용하기 위해)을 함께 사용한다.

 

Ajax 기본 코드

  $.ajax({
          type: "GET",
          url: "url을 넣으세요.",
          data: {},
          success: function(response){
              let aa = response['가져올 자료'];
              $("#aa").text(aa);
            }
          })

이렇게 Ajax를 사용하면 현재 데이터에 근거해 새로고침 할 때마다

웹페이지에 자료가 갱신된다.

 

하지만, 여기서 주의할 점은

예를 들어, 아래처럼 function에 empty를 해주지 않으면

새로운 자료가 이어 붙어서 갱신보다는 추가 개념으로 들어간다.

그래서 Ajax코드 전에 empty를 이용해 비워줘야

새로운 데이터를 가져오는 갱신 개념으로 쓸 수 있다.

function q1() {
    $('#names-q1').empty();

지난 1주 차에 *을 이용한 구글 폰트 사용에 대해서 얘기했었는데,

그것을 이번에 내 블로그에 적용해 봤다.

 

보시는 바와 같이 이전과 다른 글씨를 볼 수 있을 것이다.

(1주 차 링크: Week I learned 1주차 (tistory.com))

예시:

P.S 모바일 환경에서는 안보일 수도 있습니다.

여기서 2주차 개발일지를 마치겠습니다.