কম্পিউটার টিউটোরিয়াল

HTML DOM firstElementChild প্রপার্টি


HTML DOM firstElementChild প্রপার্টি একটি দেয়া এলিমেন্টের প্রথম চাইল্ড এলিমেন্ট রিটার্ন করতে ব্যবহৃত হয়। চাইল্ড এলিমেন্টটি শুধু এলিমেন্ট নোড হিসেবে রিটার্ন করা হয়। এটি টেক্সট এবং কমেন্ট নোডকে উপেক্ষা করে এবং সেগুলো বিবেচনা করে না। এটি একটি read-only প্রপার্টি।

সিনট্যাক্স

HTML DOM firstElementChild প্রপার্টির সিনট্যাক্স:

element.firstElementChild

উদাহরণ

firstElementChild প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <head> <script>    function eleChild() {       var ch = document.getElementById("DIV1").firstElementChild.innerHTML;       document.getElementById("Sample").innerHTML = "div-এর প্রথম এলিমেন্ট চাইল্ড নোড: "+ch;    } </script> </body> </html> <h1>firstElementChild প্রপার্টি</h1> <div id="DIV1"> <p>This is a p element</p> <span>This is a span element</span> </div> <button onclick="eleChild()">Get Child</button> <p id="Sample"></p> </body> </html>

আউটপুট

এটি নিচের আউটপুট তৈরি করবে:

HTML DOM firstElementChild প্রপার্টি

“Get Child” মেথডে ক্লিক করলে:

HTML DOM firstElementChild প্রপার্টি

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

“Get Child” বাটন তৈরি করা হয়েছে যা ইউজার ক্লিক করলে eleChild() মেথড এক্সিকিউট করবে:

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

eleChild() ফাংশন id “DIV1” ওয়ালা div-এর firstElementChild পাওয়া এবং এর innerHTML প্রপার্টি ch ভেরিয়েবলে অ্যাসাইন করা। যেহেতু firstElementChild হোয়াইটস্পেস বিবেচনা করে না, তাই এটি <p> এলিমেন্ট রিটার্ন করবে। innerHTML প্রপার্টি ব্যবহার করে <p> এলিমেন্টের ভিতরের টেক্সট পাওয়া এবং id “Sample” ওয়ালা প্যারাগ্রাফে দেখানো হয়েছে:

function eleChild() {    var ch = document.getElementById("DIV1").firstElementChild.innerHTML;    document.getElementById("Sample").innerHTML = "div-এর প্রথম এলিমেন্ট চাইল্ড নোড: "+ch; }

  1. HTML DOM fullscreenElement প্রপার্টি

  2. HTML DOM Style position প্রপার্টি

  3. HTML DOM Style pageBreakInside প্রপার্টি

  4. HTML DOM Style display প্রপার্টি