36일차 - 비동기통신 ajax (ft.제이쿼리)

내 vscode 안의 자료가 아닌, 서버에 있는 내용을 가져와 연계

1. 제이쿼리 cdn 복붙

2. load 폴더에 content.php 파일 생성

<div id="about">
    about 내용입니다
</div>

<div id="contact">
    연락관련 내용입니다
</div>

3. 서버 연결

(비번 빼먹은 상태서 캡처함)

4. html에서 < script >로 document.ready

4-1. "load 폴더 안의 content.php 데려와" 화면 출력

<script>
	$(document).ready(function(){
		$('#contact').load("/load/content.php")
        // load 폴더 안의 content.php 데려와라
	})
</script>

결과물
/load/content.php

4-2. "load 폴더 안의 content.php 중 #about만 데려와" 화면 출력

<script>
	$(document).ready(function(){
		$('#contact').load("/load/content.php #about")
        // load 폴더 안의 content.php 중 #about만 데려와라
	})
</script>

결과물