innerHeight পদ্ধতি

innerHeight পদ্ধতি এলিমেন্টের অভ্যন্তরীণ প্যাডিং বিবেচনা করে তার উচ্চতা পাওয়া এবং পরিবর্তন করতে দেয়। এটা মনে রাখা গুরুত্বপূর্ণ যে আমরা উচ্চতার 'গণনাকৃত মান' পাব (computed height)। ব্যবহারকারী পৃষ্ঠার আকার পরিবর্তন করলে, অথবা এলিমেন্ট বা তার প্যারেন্ট লুকানো থাকলে গণনায় ত্রুটি হতে পারে। উচ্চতার মান এলিমেন্টের বর্ডারের বেধ বিবেচনা করে না।

সিনট্যাক্স

এলিমেন্টের উচ্চতা পাওয়া। কিছু ক্ষেত্রে প্রাপ্ত মান ভগ্নাংশ হতে পারে:

$(সিলেক্টর).innerHeight();

এলিমেন্টের উচ্চতা পরিবর্তন করতে - কেবল একটি সংখ্যা পাঠানো যেতে পারে (উদাহরণস্বরূপ 400), তখন একক হবে পিক্সেল, অথবা একটি স্ট্রিং, যাতে একক উল্লেখ থাকে (উদাহরণস্বরূপ '10em'):

$(সিলেক্টর).innerHeight(নতুন মান);

আমরা সেটের প্রতিটি এলিমেন্টে একটি প্রদত্ত ফাংশন প্রয়োগ করতে পারি। এক্ষেত্রে ফাংশনের প্রথম প্যারামিটার হিসেবে সেটে এলিমেন্টের ইনডেক্স পাওয়া যাবে, এবং দ্বিতীয় প্যারামিটার হিসেবে - ঐ নির্দিষ্ট এলিমেন্টের বর্তমান উচ্চতার মান পাওয়া যাবে। this ফাংশনের ভিতরে বর্তমান এলিমেন্টকে নির্দেশ করবে। এলিমেন্টের উচ্চতার মানটি সেই মানে পরিবর্তিত হবে, যা ফাংশনটি রিটার্ন করে:

$(সিলেক্টর).innerHeight(function(সেটে ইনডেক্স, উচ্চতার বর্তমান মান));

উদাহরণ

তুলনা করার জন্য #test প্যারাগ্রাফের উচ্চতা সম্পর্কে তথ্য আউটপুট করা যাক, যা পাওয়া গেছে height এবং innerHeight পদ্ধতি দ্বারা:

<p id="test">text</p>
<p id="out1"></p>
<p id="out2"></p>

p {
	margin: 10px;
	padding: 5px;
	border: 2px solid blue;
}

let h1 = $('#test').height();
let h2 = $('#test').innerHeight();

$('#out1').text(h1);
$('#out2').text(h2);

আমরা 10px তে পার্থক্য দেখতে পাব, যা আমাদের উপরের এবং নীচের অভ্যন্তরীণ প্যাডিংয়ের সমষ্টি।

আরও দেখুন

height পদ্ধতি,
যা এলিমেন্টের উচ্চতা পাওয়া এবং পরিবর্তন করতে দেয়
outerHeight পদ্ধতি,
যা এলিমেন্টের উচ্চতা পাওয়া এবং পরিবর্তন করতে দেয়, তার প্যাডিং এবং বর্ডার বিবেচনা করে