>  기사  >  웹 프론트엔드  >  자바스크립트에서 요소의 너비와 높이를 설정하는 방법

자바스크립트에서 요소의 너비와 높이를 설정하는 방법

藏色散人
藏色散人원래의
2021-11-15 15:22:374424검색

JavaScript에서 요소의 너비와 높이를 설정하는 방법: 1. html 요소의 너비와 높이를 가져옵니다. 2. "main.style.width" 및 "main.style.dll"을 통해 요소의 너비와 높이를 설정합니다. 키".

자바스크립트에서 요소의 너비와 높이를 설정하는 방법

이 기사의 운영 환경: windows7 시스템, javascript 버전 1.8.5, DELL G3 컴퓨터

Javascript로 요소의 너비와 높이를 설정하는 방법은 무엇입니까?

JS 요소의 너비와 높이를 가져옵니다. html 요소를 사용하고 너비와 높이를 설정하세요

브라우저 가져오기 너비와 높이:

 var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var height = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

html 요소의 너비와 높이를 가져오는 두 가지 방법

// 首先是取到元素
var main = document.getElementById('main');
// 第一种方式
var mainWidth = main.offsetWidth,
mainHeight = main.offsetHeight;
// 第二种方式
var mainWidth2 = main.style.width,
mainHeight2 = main.style.height;

두 방법의 차이점은 첫 번째 방법이 너비와 높이를 가져올 수 있다는 것입니다. 두 번째 방법은 html 너비와 높이에 정의된 너비와 높이만 가져올 수 있지만 CSS에 정의된 너비와 높이는 가져올 수 없습니다.

너비와 높이 설정

main.style.width = "120px";
main.style.height = "130px";

이 방법만 있고, 다음 방법은 불가능합니다. Firefox 테스트.

main.style.offsetWidth = "120px";
main.style.offsetHeight = "130px";

추천 학습: "JavaScript 기본 튜토리얼"

위 내용은 자바스크립트에서 요소의 너비와 높이를 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.