2009-04-28 3 views
2

는 HTML 페이지를 가정하여 X의 픽셀 페이지의 높이를 증가 페이지 중간.어떻게에만 자바 스크립트

자바 스크립트 블록을 사용하여 페이지 아래쪽에 "패딩"하여 전체 페이지 높이를 150 픽셀 늘리는 방법은 무엇입니까?

나는 간단한 해결책이 될 것이라고 HTML 변경할 수있는 경우 :

<html> 
    <body> 
    .. html content (outside of our control) .. 
    .. javascript block .. 
    .. some more html content (outside of our control) .. 
    <div style="height: 150px; clear: both;"></div> 
    </body> 
</html> 

하지만 어떻게 난 단지 자바 스크립트 블록을 사용하여이를 달성 할을?

이상적인 솔루션은 브라우저 간 호환이 가능하고 100 % 인라인 (자바 스크립트 라이브러리를 사용하지 않음)이어야합니다.

업데이트 # 1 : 자바 스크립트 블록은 페이지의 전체 DOM에 액세스 할 수 있습니다.

업데이트 # 2 : 페이지의 전체 길이 (DOM 변경 전)는 다양합니다.

업데이트 # 3 : 다른 우수한 jQuery와 같은 자바 스크립트 라이브러리를 사용할 수 없다고 가정합니다.

+0

는 자바 스크립트 iframe에 예정, 또는 당신은 전체 페이지에 DOM 접근 할 것인가? – jacobangel

답변

6

업데이트 코드 :

var space = document.createElement('div'); 
space.style.height = "150px"; 
space.style.clear = "both"; 
document.getElementsByTagName("body")[0].appendChild(space); 
+0

고마워 - 나는 그 질문을 분명히했다. 업데이트 # 2를 참조하십시오. – knorv

+0

페이지의 길이에 관계없이 작동합니다. 나는 투표에서 벗어났다. 아니면 나는 투표했을 것이다. 나는 근본적으로 같은 것을 게시하려하고 있었다. – zombat

+0

원본 코드가 절대 높이 만 생성했습니다. 업데이트 된 버전입니다. – cobbal

1

javascript를 통해 DOM 요소를 생성하고 해당 div를 하단에 간단하게 추가 할 수 있습니까?

나는 코발에 투표 할거야. 만약 내가 어떤 대표라도 .. ㅎ. .

0

$ ('몸') 추가 ($ ('< DIV 스타일 = "높이 : 150 픽셀 클리어 : 모두;"> </DIV >'));

어쩌면

+0

@PaulG 왜 이것을 편집 했습니까? 그것은 당신의 편집과 함께 작동하지 않습니다. –

+0

아, 죄송합니다. 존 (John)이 알려지지 않은 코드 형식의 이스케이프 문자가 추가 된 것 같습니다. 미안합니다. 이 대답은 검토 절의 '저질질 게시판'으로 보았을 때 가능하면 확장 할 가치가 있습니다. – PaulG