개발 Q&A

제목 <head>안의 내용이 body로 들어가네요..
글쓴이 eden 작성시각 2013/06/07 10:37:08
댓글 : 3 추천 : 0 스크랩 : 0 조회수 : 14676   RSS
<head>안에 넣어놓은 메타태그나 css, js등을 불러오는 모든 태그들이
크롬 개발자모드에서 소스를 보면 head는 텅 비어있고 body안으로 모두 들어가있네요..
작동은 문제없이 잘 되구, 개발자 도구가 아닌 소스보기로 봤을 때는 태그가 정상적으로 head안에 출력이 되는데..
이상하게 크롬개발자모드에서만 body안으로 모든 태그가 이동해있네요..
왜그런걸까요..ㅜ
 다음글 이미지 캐쉬 관련해서 여쭤볼게 있습니다. (4)
 이전글 phpmyadmin 에서 디비디자이너 기능 사용. (1)

댓글

변종원(웅파) / 2013/06/07 11:03:27 / 추천 0
 게시판 이동합니다.

제 크롬 브라우저에서 포럼은 정상적으로 head안에 meta태그 나옵니다.

다른 사이트도 모두 그렇게 나온다면 크롬 브라우저 문제일거 같네요.


크롬 버전 27.0.1453.94 m


eden / 2013/06/07 12:15:37 / 추천 0
 다른사이트는 잘 나오는데 제 사이트만 그래서 확인해보니
저장형식이 utf-8 BOM 으로 되있어서 그랬네요 ㅠ
utf-8로 변환하니 문제해결했습니다 ㅎㅎ
감사합니다
risa / 2013/06/08 09:51:30 / 추천 0
 덫 붙이자면...

이 문제는 생각보다 가벼운 문제가 아닙니다.


그냥 헤드에 들어가있으니 바디로 단순히 내려왔느니의 문제가 아니라

스타일 자체가 완전히 깨질수가 있습니다.

일종의 CSS 선언 스타일과 순서의 차이긴 하지만...


head 안에 들어간거랑 body 안에서 인식하는거랑 브라우져가 다르게 인식합니다.

예를들면 크롬은 어느정도 디버그 기능이 달려있어서 문제가 안되는데

IE에선 있는그대로 읽다보니 스타일이 확 깨지는 경우가 생깁니다.


즉 소스보기에서는 헤드안에 넣었지만 어떤 문제때문에 브라우져에선 바디 밑으로 내려온겁니다.

이건 100% 코딩 미스 입니다.

대표적으로 컨트롤러에서 echo 를 찍어버리면 뷰를 로드하기 전에 echo를 찍습니다.

echo "test"
load->view(head)
load->view(main)
load->view(foot)

에코를 찍어 버렸기에 브라우져에선 [먼저] test를 찍습니다.

문자를 찍으면 브라우저는 자동으로 body 안에 밀어 넣습니다.

이후에 load 된 head는 <body> 이안에서 호출 </body> 

이런식으로 읽혀지는게 아닌가 추측이 됩니다.

[실제 테스트 해보시면 echo 를 찍는 순간 브라우저는 
<html>
<head>
</head>
<body>
echo
</body>
</html>
을 자동 완성 시킵니다.]

정상적인 헤드 안에서의 호출과 보디 구문 에서의 호출은 CSS 문제를 읽으킬수 있으니

정상적으로 잘 head 안에 CSS와 JS 호출을 넣는게 좋습니다.

[물론 헤드든 보디든 어느쪽이든 문제 없는 CSS를 만든다면 상관없기도 합니다.
참고로 부트스트립 조차 깨집니다.]