HTML DOM firstChild প্রপার্টি একটি নির্দিষ্ট নোডের প্রথম চাইল্ড নোড নোড অবজেক্ট হিসেবে রিটার্ন করতে ব্যবহৃত হয়। এটি টেক্সট নোড, এলিমেন্ট নোড বা কমেন্ট নোড হিসেবে রিটার্ন করতে পারে যা নোডটি প্রথমে থাকে তার ওপর নির্ভর করে। এটি একটি read-only প্রপার্টি।
সিনট্যাক্স
HTML DOM firstChild প্রপার্টির সিনট্যাক্স:
node.firstChild
উদাহরণ
firstChild প্রপার্টির উদাহরণ:
<!DOCTYPE html> <html> <head> <script> function getFirst() { var ch = document.getElementById("DIV1").firstChild.innerHTML; document.getElementById("Sample").innerHTML = "div-এর প্রথম চাইল্ড নোড: "+ch; } </script> </head> <body> <h1>firstChild প্রপার্টি</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>আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
“Get Child” বাটনে ক্লিক করলে:
আমরা একটি <div> এলিমেন্ট তৈরি করেছি যার ভিতরে একটি <p> এবং একটি <span> এলিমেন্ট আছে। div এলিমেন্টের ভিতরে কোনো হোয়াইটস্পেস নেই কারণ firstChild প্রপার্টি হোয়াইটস্পেসকে টেক্সট নোড হিসেবে বিবেচনা করে এবং সেটি প্রথম চাইল্ড বানাবে। সেক্ষেত্রে এটি undefined রিটার্ন করবে।
<div id="DIV1"><p>This is a p element</p><span>This is a span element</span></div>
তারপর “Get child” বাটন তৈরি করা হয়েছে যা ইউজার ক্লিক করলে getFirst() মেথড এক্সিকিউট করবে:
<button onclick="getFirst()">Get Child</button>
getFirst() মেথড firstChild প্রপার্টি ব্যবহার করে div এলিমেন্টের প্রথম চাইল্ড পাওয়া যা আমাদের কেসে <p> এলিমেন্ট রিটার্ন করবে। তারপর innerHTML প্রপার্টি ব্যবহার করে p এলিমেন্টের ভিতরের টেক্সট পাওয়া এবং ch ভেরিয়েবলে অ্যাসাইন করা। এই মানটি id “Sample” ওয়ালা প্যারাগ্রাফে innerHTML প্রপার্টি ব্যবহার করে প্রদর্শন করা হয়েছে:
function getFirst() { var ch = document.getElementById("DIV1").firstChild.innerHTML; document.getElementById("Sample").innerHTML = "div-এর প্রথম চাইল্ড নোড: "+list; } 