집 >웹 프론트엔드 >프런트엔드 Q&A >jquery를 사용하여 div 높이를 변경하는 방법

jquery를 사용하여 div 높이를 변경하는 방법

青灯夜游원래의: 2022-05-17 19:01:454312검색

3가지 방법: 1. "$("div").height(height value)"를 사용하여 새 높이 값을 설정합니다. 2. "$("div").css("height","height value"를 사용합니다. )", 새 높이 스타일을 추가합니다. 3. "$("div").attr("style","height:value")"를 사용합니다.

이 튜토리얼의 운영 환경: windows7 시스템, jquery3.2.1 버전, Dell G3 컴퓨터.

jquery에서 요소의 높이를 수정하는 방법은 여러 가지가 있습니다.

height()
css()
attr()

1. div 높이 수정

height() 메서드는 일치하는 요소의 높이를 설정할 수 있습니다. 구문:

$("div").height(高度值)

예:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-3.2.1.min.js"></script>
		<script>
			$(document).ready(function() {
				$("#but1").click(function() {
					$("div").height("30px");
				});
				$("#but2").click(function() {
					$("div").height("100px");
				});
			});
		</script>
		<style>
			div{
				height: 60px;
				background-color: #FFC0CB;
			}
		</style>
	</head>
	<body>

		<div>
			一个div元素，高度60px
		</div>
		<br>
		<button id="but1">减小div高度</button>
		<button id="but2">增大div高度</button>
	</body>
</html>

jquery를 사용하여 div 높이를 변경하는 방법

2. css()를 사용하여 div 높이를 수정합니다.

css()를 사용하여 td 요소에 높이 스타일을 추가합니다. 방법 1의 예에서

$("div").css("height","高度值");

jquery를 사용하여 div 높이를 변경하는 방법

3을 수정하세요. attr()을 사용하여 div 높이를 수정하세요

attr()을 사용하여 스타일 속성 값을 제어하고 td 요소에 높이 스타일을 추가하세요. 구문:

$(document).ready(function() {
	$("button").click(function() {
		$("div").css("height","40px");
	});
});

예: 방법 1 예제를 기반으로

$("div").attr("style","height:高度值")

jquery를 사용하여 div 높이를 변경하는 방법 수정 [권장 학습:

jQuery 비디오 튜토리얼

, 웹 프론트엔드 비디오]

위 내용은 jquery를 사용하여 div 높이를 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

jquery css td

성명：

이전 기사：Jquery에서 태그 속성을 제거하는 방법다음 기사：Jquery에서 태그 속성을 제거하는 방법