.height()
Định nghĩa và sử dụng .height()xác định hoặc gán giá trị chiều cao (height) cho thành phần. .height() được ứng dụng rất nhiều, như việc xác định chiều cao của window, hay thành phần, hoặc chỉnh chiều cao 2 thành phần cho bằng nhau. .height() Cấu trúc Xác định giá trị chiều cao của thành phần. […]
Định nghĩa và sử dụng
.height()xác định hoặc gán giá trị chiều cao (height) cho thành phần..height()được ứng dụng rất nhiều, như việc xác định chiều cao của window, hay thành phần, hoặc chỉnh chiều cao 2 thành phần cho bằng nhau.
.height()
Cấu trúc
Xác định giá trị chiều cao của thành phần.
$('p').height();
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<style>
p { height: 100px; }
</style>
<script>
$(function(){
var hDiv = $('div').height();
$('span').text('Chiều cao của thành phần div: ' + hDiv+'px');
});
</script>
</head>
<body>
<div>
<p>Thành phần p con của div</p>
</div>
<span></span>
</body>
</html>
Hiển thị trình duyệt:
Thành phần p con của div
Chiều cao của thành phần div: 100px
$('div').height() cho ta biết thành phần div có giá trị chiều cao là bao nhiêu.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <div> <p>Thành phần p con của div</p> </div> <span></span> |
<div> <p>Thành phần p con của div</p> </div> <span>Chiều cao của thành phần div: 100px</span> |
.height(val)
Cấu trúc
Gán giá trị chiều rộng cho thành phần.
.height(giá trị)
$('p').height(100);
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('div').height(100);
});
</script>
</head>
<body>
<div style="background-color: yellow;">
<p>Thành phần p con của div</p>
</div>
</body>
</html>
Hiển thị trình duyệt:
Thành phần p con của div
$('div').height(100) sẽ giúp gán chiều cao cho thành phần div 100px.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <div style=”background-color: yellow;”> <p>Thành phần p con của div</p> </div> |
<div style=”height: 100px; background-color: yellow;”> <p>Thành phần p con của div</p> </div> |