티스토리 뷰
spa.html
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>SPA(Single Page Application)</title>
<style>
.divdistance{
height : 500px;
}
</style>
</head>
<body>
<!-- spa : single page application -->
<p id = "start"> 메뉴 </p>
<a href = "#one"> 첫 페이지 </a>
<a href = "#two"> 둘째 페이지 </a>
<a href = "#three"> 셋째 페이지 </a>
<div class = "divdistance" backgroundcolor = yellow></div>
<p id = "one">첫 페이지 : SPA(Single Page Application)으로 프로그래밍</p>
<a href = "#start"> 메뉴로 </a>
<div class = "divdistance" background-color = blue></div>
<p id = "two">둘째 페이지 : 한페이지 내에서 위치 이동 </p>
<a href = "#start"> 메뉴로 </a>
<div class = "divdistance"></div>
<p id = "three">셋째 페이지 : 다양한 형태로 변화가능</p>
<a href = "#start"> 메뉴로 </a>
<div class = "divdistance" background-color = "red"></div>
<a href= "javascript: ">빈코드</a>
<a href= "javascript:alert('hello');">인라인 코딩</a>
<a href= "javascript:test();"> 함수호출</a>
<a href= "style.html" target="_blank"> 첫 html로 이동 </a>
<script>
//페이지가 로딩할 때 준비 (자바 스크립트에서는 리턴값도 무, 접근지정자도 무)
//함수는 일급객체: 변수 대입시 유명함수, 넣지 않으면 무명함수(익명함수).
var test = function(){
console.log("test함수 호출됨");
};
</script>
<a href = "javascript: ">빈코드</a>
</body>
</html>