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

জাভাস্ক্রিপ্টে getElementById কীভাবে কাজ করে?

getElementById

getElementById() একটি DOM মেথড যা সেই এলিমেন্টটি ফেরত দেয় যার ID অ্যাট্রিবিউট নির্দিষ্ট ভ্যালুর সাথে মিলে। এটি HTML DOM-এ সবচেয়ে কমন মেথডগুলোতে একটি এবং প্রায় হরবারের ডকুমেন্টের এলিমেন্ট ম্যানিপুলেট করতে চাইলে এটি ব্যবহার করা হয়। যদি নির্দিষ্ট ID-র কোনো এলিমেন্ট না থাকে তবে এটি null ফেরত দেয়। ID পেজের মধ্যে ইউনিক হওয়া উচিত। তবে যদি একাধিক এলিমেন্ট একই ID-র সাথে থাকে, তবে জাভাস্ক্রিপ্ট কোডে শেষ এলিমেন্টটি ফেরত দেয়।

উদাহরণ-১

নিচের উদাহরণে, একটি প্যারাগ্রাফ ট্যাগ আছে যার ইনার টেক্সট "GetElementById" এবং ID "element"। DOM মেথড "document.getElementById()" ব্যবহার করে প্যারাগ্রাফ ট্যাগের ভিতরের টেক্সট অ্যাক্সেস করা হয়েছে এবং ভ্যালু আউটপুটে দেখানো হয়েছে। ".innerHTML" ছাড়া document.getElementById কোনো ট্যাগের ইনার টেক্সট পড়তে পারে না।

<html> <body> 
  <p id="element">GetElementById</p> 
  <script> 
    var s = document.getElementById("element").innerHTML; 
    document.write(s); 
  </script> 
</body> </html>

আউটপুট

GetElementById GetElementById

উদাহরণ-২

নিচের উদাহরণে, DOM মেথড "getElementById" ব্যবহার করে মূল টেক্সট "GetElementById" কে "Tutorix" দিয়ে রিপ্লেস করা হয়েছে এবং ফলাফল আউটপুটে দেখানো হয়েছে।

<html> <body> 
  <p id="element">GetElementById</p> 
  <script> 
    document.getElementById("element").innerHTML = "Tutorix"; 
  </script> 
</body> </html>

আউটপুট

Tutorix
  1. JavaScript-এর getElementById গেটার ব্যবহার করার পদ্ধতি

  2. জাভাস্ক্রিপ্ট দিয়ে এলিমেন্ট লুকানো আছে কিনা যাচাই করা

  3. জাভাস্ক্রিপ্ট অ্যারেতে এলিমেন্ট সার্চ করা

  4. জাভাস্ক্রিপ্টে অ্যারেতে কোনো এলিমেন্ট повтор হয়েছে কিনা যাচাই করা