Metode height

Metode height memungkinkan untuk mendapatkan dan mengubah tinggi elemen. Penting untuk diingat, bahwa kita akan mendapatkan 'nilai terhitung' tinggi (computed height). Berbeda dengan metode css('height'), metode ini mengembalikan nilai tanpa satuan (contohnya 400) dan nyaman untuk perhitungan matematis. Metode ini mendapatkan tinggi konten elemen, terlepas dari penentuan properti CSS box-sizing. Untuk menghindari perhitungan yang tidak perlu, disarankan untuk menggunakan css('height'). Kesalahan dalam perhitungan juga dapat terjadi, jika pengguna mengubah ukuran halaman, serta, jika elemen atau induknya disembunyikan. Nilai tinggi tidak memperhitungkan nilai padding dan border.

Sintaks

Mendapatkan tinggi elemen. Dalam beberapa kasus nilai yang didapat mungkin berupa pecahan:

$(selector).height();

Untuk mengubah tinggi elemen - dapat diberikan angka saja (contohnya 400), maka satuan pengukurannya akan menjadi piksel, atau string, dengan menentukan satuan pengukuran (contohnya '10em'):

$(selector).height(nilai baru);

Kita juga dapat menerapkan fungsi yang ditentukan ke setiap elemen dalam kumpulan. Dalam hal ini parameter pertama fungsi akan menerima indeks elemen dalam kumpulan, dan parameter kedua - nilai tinggi saat ini untuk elemen tertentu. this di dalam fungsi akan menunjuk ke elemen saat ini.

Nilai tinggi elemen akan berubah menjadi nilai yang dikembalikan oleh fungsi:

$(selector).height(function(indeks dalam kumpulan, nilai tinggi saat ini));

Contoh

Mari saat klik pada #test ubah tingginya menjadi nilai 30px, menggunakan metode height, serta dengan css ubah latarnya menjadi hijau:

<div id="test"></div>

#test {
	width: 50px; 
	height: 90px;
	background: red; 
	color: white;
	margin-top: 10px; 
	cursor: pointer;
}

$('#test').one('click', function() {
	$(this).height(30).css({
		cursor: 'auto',
		backgroundColor: 'green'
	});
});

Lihat juga

metode width,
yang memungkinkan untuk mendapatkan dan mengubah lebar elemen
metode innerHeight,
yang memungkinkan untuk mendapatkan dan mengubah tinggi elemen, termasuk padding dalamnya
metode outerHeight,
yang memungkinkan untuk mendapatkan dan mengubah tinggi elemen, termasuk padding dan border-nya
metode css,
yang memungkinkan untuk mendapatkan dan mengubah gaya CSS elemen