কম্পিউটার

HTML DOM firstChild সম্পত্তি


HTML DOM firstChild প্রপার্টি একটি নির্দিষ্ট নোডের প্রথম চাইল্ড নোডকে নোড অবজেক্ট হিসেবে ফেরত দেওয়ার জন্য ব্যবহার করা হয়। কোন নোডটি প্রথম তার উপর নির্ভর করে এটি একটি পাঠ্য নোড, উপাদান নোড বা একটি মন্তব্য নোড হিসাবে ফিরে আসতে পারে। এটি একটি শুধুমাত্র পঠনযোগ্য সম্পত্তি৷

সিনট্যাক্স

HTML DOM firstChild প্রপার্টি -

-এর সিনট্যাক্স নিচে দেওয়া হল
node.firstChild

উদাহরণ

আসুন ফার্স্টচাইল্ড প্রপার্টি -

-এর জন্য একটি উদাহরণ দেখি
<!DOCTYPE html>
<html>
<head>
<script>
   function getFirst() {
      var ch = document.getElementById("DIV1").firstChild.innerHTML;
      document.getElementById("Sample").innerHTML = "The first child node of the div is :"+ch;
   }
</script>
</head>
<body>
<h1>firstChild property</h1>
<div id="DIV1"><p>This is a p element</p><span>This is a span element</span></div>
<button onclick="getFirst()">Get Child</button>
<p id="Sample"></p>
</body>
</html>

আউটপুট

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

তৈরি করবে

HTML DOM firstChild সম্পত্তি

"শিশু পান" বোতামে ক্লিক করার পরে -

HTML DOM firstChild সম্পত্তি

আমরা একটি

উপাদান তৈরি করেছি যার ভিতরে একটি

এবং একটি উপাদান রয়েছে। ফার্স্টচাইল্ড প্রপার্টি হোয়াইটস্পেসকে টেক্সট নোড হিসাবে বিবেচনা করে এবং এটি হোয়াইটস্পেসকে প্রথম চাইল্ড হিসাবে বিবেচনা করে ডিভ উপাদানের ভিতরে কোনও হোয়াইটস্পেস নেই। সেই ক্ষেত্রে এটি অনির্ধারিত ফিরে আসবে৷

<div id="DIV1"><p>This is a p element</p><span>This is a span element</span></div>

তারপরে আমরা "শিশু পান" বোতামটি তৈরি করেছি যা ব্যবহারকারী দ্বারা ক্লিক করলে getFirst() পদ্ধতিটি কার্যকর করবে -

<button onclick="getFirst()">Get Child</button>

getFirst() পদ্ধতি ফার্স্টচাইল্ড প্রপার্টি ব্যবহার করে ডিভ এলিমেন্টের প্রথম চাইল্ড পায় যা আমাদের ক্ষেত্রে

এলিমেন্ট রিটার্ন করবে। আমরা তখন innerHTML প্রপার্টি ব্যবহার করে p এলিমেন্টের ভিতরে টেক্সট পাই এবং সেই মানটি ch পরিবর্তনশীলে বরাদ্দ করি। অভ্যন্তরীণ এইচটিএমএল প্রপার্টি -

ব্যবহার করে উদ্দিষ্ট টেক্সট বরাদ্দ করে আইডি "নমুনা" সহ অনুচ্ছেদে এই মানটি প্রদর্শিত হয়।
function getFirst() {
   var ch = document.getElementById("DIV1").firstChild.innerHTML;
   document.getElementById("Sample").innerHTML = "The first child node of the div is :"+list;
}

  1. HTML DOM শৈলী অবস্থান সম্পত্তি

  2. HTML DOM শৈলী পেজ ব্রেক বিফোর প্রপার্টি

  3. HTML DOM শৈলী পেজব্রেকইনসাইড প্রপার্টি

  4. HTML DOM শৈলী প্রদর্শন সম্পত্তি