인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

최민지님의 프로필 이미지
최민지

작성한 질문수

면접과 취업을 부르는 '퍼블리셔 개인 포트폴리오 홈페이지' 제작

[Coding Mission 05] Header와 footer를 include하는 제이쿼리 load 메서드(실습)

공통요소를 include하는 load 메서드

작성

·

586

1

안녕하세요! 코딩미션 다섯번째 강의 참고해서 홈페이지를 만들고 있는데요,

루트폴더가 이렇게 되어있는 경우에도

$('.header-include').load('header.html');

이렇게 똑같이 제이쿼리 구문 작성하면 되나요?

 

html과 같이 css루트도 css/common/header.css 이렇게 되어있는데

이런경우 header.css는 header.html에 링크하면 되나요? 아니면 index.html에 링크하면 되나요?

스크린샷 2022-10-19 오후 3.48.29.png스크린샷 2022-10-19 오후 3.48.38.png스크린샷 2022-10-19 오후 3.48.45.png

답변 1

1

header.html 도 결국은 index.html에서 불러와지는 것이기 때문에 CSS 파일은 index.html에서 모두 링크하시면 됩니다.

당연히 header.html 을 load로 인클루드 했다면 header.html 에 head 라는 태그가 없기 때문에서 css를 링크할 수도 없습니다.

 

최민지님의 프로필 이미지
최민지
질문자

최상위에 index.html / css / images / js / html 폴더들을 놓고 html폴더 > common폴더 > header.html / footer.html을 넣어둔 뒤 index.html에서 include하면 적용이 안됩니다ㅠㅠ

index와 header.html, footer.html 이 같은 레벨에 있을 때만 적용이 되는데 어떻게 해야할까요?

load 하려는 html과 불러오려는 html이 같은 레벨에 있을때만 적용이 되는걸까요??

    $('.header-include').load('header.html')
최민지님의 프로필 이미지
최민지

작성한 질문수

질문하기