모든 페이지에 동일한 메뉴/바닥 글을 추가하는 함수/매크로

-1

내 페이지에 삽입 할 때 HTML로 확장되는 함수/매크로를 정의하려고합니다. 모든 페이지에서 반복하지 않아도 모든 페이지에서 동일한 내 바닥 글과 메뉴에이 기능을 사용하고 싶습니다. 무언가가 변경되면 모든 페이지를 수동으로 업데이트해야하기 때문에 ...모든 페이지에 동일한 메뉴/바닥 글을 추가하는 함수/매크로

이것은 내 개인 웹 사이트 (10-15 페이지)이므로 순수한 HTML/CSS를 사용하여 재미가 있습니다.

<footer id="footer"> 
    <p>(c) Mattias Lindberg, 2011-2014</p> 
</footer>

그리고 내가하고 싶은 모두가 아래에 비슷한 일을 추가 할 수 있습니다 : :

<footer id="footer" />

를 어느 다음해야 내가 아래에있는 내 바닥 글 HTML은 모든 페이지에 표시 할 예를 들어

위의 HTML로 확장하십시오.

HTML/CSS/jQuery 또는 다른 클라이언트 측 기술을 사용하여 어떻게 수행 할 수 있습니까?

출처

2014-01-11 Mattias Lindberg

태그 목록에 PHP을 지정하지 않았으므로 여기에 Jquery 코드가 있습니다.

HTML 페이지 : footer.html.

<footer> 
<p>(c) Mattias Lindberg, 2011-2014</p> 
</footer>

당신의 footer.html를 원하는 모든 페이지에이 Jquery 스크립트를 추가합니다.

$(document).ready(function(e) { 
    $('#footer').load('pathtofooter.html'); 
});

어디서나 body 태그 안에이 HTML 코드를 추가합니다.

<div id='footer'></div>

참조 : jquery.load()

질문은?

출처

2014-01-11 09:27:46 manta

왜 downvote? –

그래, 나도 알고 싶니? – manta

글쎄, 나는 그것을 좋아한다. 그래서 나는 그것을 뒤로 뽑았다! –

-2

footer.html에 작성하고 아약스를 통해 가져 와서 본문에 추가하십시오.

출처

2014-01-11 08:39:05

문제가 무엇입니까? 답에 op에 대한 전체 코드 솔루션이 포함되어 있어야합니까?! –

당신은 당신의 스크립트에서 하드 코딩하고, 페이지가로드 될 때 호출 할 수 있습니다 :

$(document).ready(function() { 

    var headerHtml = 'Whatever'; 
    var footerHtml = '<footer id="footer">\ 
         <p>(c) Mattias Lindberg, 2011-2014</p>\ 
         </footer>'; 

    $('#header-anchor').after(headerHtml); 
    $('#footer-anchor').after(footerHtml); 
});

그냥 머리글과 바닥 글을 데려 가고 싶다는 앵커를 사용합니다.

출처

2014-01-11 08:46:35

모든 페이지에 동일한 메뉴/바닥 글을 추가하는 함수/매크로

답변

관련 문제