외부 html div 추가

페이지마다 똑같지만 제목만 바뀌는 헤더가 다 들어갈 경우 일일히 헤더를 추가해서 값을 변경하는건 굉장히 비효율적!

헤더를 하나만 만들어서 바꾸고 싶은 것만 바꿔서 간편하게 관리하자!

 

 

html

<!-- page1.html -->

<div id="html"></div>

<!-- page2.html -->

<div>
	<p id="title">타이틀을 바꿀수 있다</p>
</div>

script

<script>
	$(document).ready(function(){
    	$(function(){
        	$("#html").load("page/page2.html"), function(){
            	$this.find("#title").html("페이지1")
            })
        })
     })
     
</script>

 

이렇게 jQuery를 이용해서 title이라는 아이디만 찾고 지정을 해주면 쉽게 관리할 수 있다. :)