계속 바뀌는 고양이 사진을 버튼을 클릭하면 보여주기.
즉 이번에는 url을 가지고 와야함.
$('#img-cat').attr('src',imgurl)

Jquery 이미지 태크 이미지 주소 바꾸기
(jquery img 태그 src 변경하기) ---> 구글에 검색해서 jquery 함수 찾기
attr 요게 신기하네!!

<style type="text/css">
  div.question-box {
    margin: 10px 0 20px 0;
  }
  div.question-box > div {
    margin-top: 30px;
  }

</style>

<script>
  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)
               }

},)
}

</script>

JQuery+Ajax의 조합을 연습하자!

<hr/>

<div class="question-box">
  <h2>3. 랜덤 고양이 사진 API를 이용하기</h2>
  <p>예쁜 고양이 사진을 보여주세요</p>
  <p>업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다.</p>
  <button onclick="q1()">고양이를 보자</button>
  <div>
    <img id="img-cat" src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png"/>
  </div>
</div>