HTML DOM চাইল্ড এলিমেন্ট কাউন্ট প্রপার্টি

HTML DOM childElementCount প্রপার্টি হল একটি পঠনযোগ্য সম্পত্তি যা একটি প্রদত্ত এলিমেন্টের চাইল্ড এলিমেন্টের সংখ্যা প্রদান করে। চাইল্ড এলিমেন্ট কাউন্টের রিটার্ন প্রকারটি স্বাক্ষরবিহীন দীর্ঘ। এটি শুধুমাত্র সেই নোডের চাইল্ড এলিমেন্ট ফেরত দেবে যেখানে এটি জিজ্ঞাসা করা হয়েছে এবং একটি HTML নথির সমস্ত চাইল্ড নোড নয়৷

সিনট্যাক্স

চাইল্ড এলিমেন্ট কাউন্ট সম্পত্তি -

এর জন্য সিনট্যাক্স নিচে দেওয়া হল

node.childElementCount

উদাহরণ

আসুন HTML DOM চাইল্ড এলিমেন্ট কাউন্ট প্রপার্টি −

এর একটি উদাহরণ দেখি

<!DOCTYPE html>
<html>
<head>
<style>
   div {
      border: 2px solid blue;
      margin: 7px;
      padding-left:20px;
   }
</style>
</head>
<body>
<p>Click the button below to find out the no of children of the div element</p>
<button onclick="childCount()">COUNT</button>
<div id="myDIV">
<h3>HEADING</h3>
<p>First p element</p>
<p>Second p element</p>
</div>
<p id="Sample"></p>
<script>
   function childCount() {
      var x = document.getElementById("myDIV").childElementCount;
      document.getElementById("Sample").innerHTML = "The div element has "+x+" children";
   }
</script>
</body>
</html>

আউটপুট

এটি নিম্নলিখিত আউটপুট −

তৈরি করবে

HTML DOM চাইল্ড এলিমেন্ট কাউন্ট প্রপার্টি

COUNT বোতামে ক্লিক করলে -

HTML DOM চাইল্ড এলিমেন্ট কাউন্ট প্রপার্টি

উপরের উদাহরণে -

আমরা "myDIV" আইডি সহ একটি

উপাদান এবং এর ভিতরে তিনটি উপাদান তৈরি করেছি। দুটি

উপাদান এবং একটি

হেডার। আমরা ডিভ-এ রঙিন সীমানা, মার্জিন এবং প্যাডিং যোগ করেছি যাতে এটিকে অন্যান্য উপাদান থেকে আলাদা করা যায় -

div {
   border: 2px solid blue;
   margin: 7px;
   padding-left:20px;
}
<div id="myDIV">
<h3>HEADING</h3>
<p>First p element</p>
<p>Second p element</p>
</div>

তারপরে আমরা একটি বোতাম COUNT তৈরি করেছি যা ক্লিকে চাইল্ডকাউন্ট() পদ্ধতিটি কার্যকর করবে।

<button onclick="childCount()">COUNT</button>

childCount() পদ্ধতিটি "myDIV" আইডি সহ উপাদানটি নেয়, যেটি আমাদের ক্ষেত্রে

, উপাদান এবং তার চাইল্ডএলিমেন্টকাউন্ট প্রপার্টি মান পরিবর্তনশীল x-এ বরাদ্দ করে। যেহেতু আমাদের দুটি

উপাদান এবং

এর ভিতরে একটি

উপাদান রয়েছে, তাই চাইল্ড এলিমেন্ট কাউন্ট 3 প্রদান করেছে।

প্রত্যাবর্তিত মানটি অনুচ্ছেদে −

এর innerHTML() পদ্ধতি ব্যবহার করে আইডি "নমুনা" সহ অনুচ্ছেদে প্রদর্শিত হয়।

function childCount() {
   var x = document.getElementById("myDIV").childElementCount;
   document.getElementById("Sample").innerHTML = "The div element has "+x+" children";
}