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

জাভাস্ক্রিপ্টে নির্দিষ্ট পজিশনে নির্দিষ্ট এলিমেন্ট ইনসার্ট করা

জাভাস্ক্রিপ্ট-এ "insertAdjacentElement()" মেথড দেওয়া আছে একটি ইতিমধ্যে এক্সিস্টিং এলিমেন্টকে একটি নির্দিষ্ট পজিশনে ইনসার্ট করতে। যদি একই নামে একাধিক এলিমেন্ট থাকে, তবে অ্যারে এলিমেন্টের মত করে ইনডেক্স ব্যবহার করে অ্যাক্সেস করা যায়।

সিনট্যাক্স

node.insertAdjacentElement(position, element);

উদাহরণ-১

নিচের উদাহরণে, আসলে ৩টি এলিমেন্ট প্যারালেলে আছে: span1, span2, এবং header। insertAdjacentElement() মেথড ব্যবহার করে span1 এলিমেন্টটি header-এর নিচে রাখা হয়েছে আউটপুটে দেখানো মতে।

<html> <body> 
  <span>My span1</span> <span>My span2</span> <h2 id="H2">My Header</h2> 
  <script> 
    var s = document.getElementsByTagName("span")[0]; 
    var h = document.getElementById("H2"); 
    h.insertAdjacentElement("afterend", s); 
  </script> 
</body> </html>

আউটপুট

My span2 My Header My span1

উদাহরণ-২

নিচের উদাহরণে, আসলে ৩টি এলিমেন্ট প্যারালেলে আছে: span1, span2, এবং header। insertAdjacentElement() মেথড ব্যবহার করে span2 এলিমেন্টটি header-এর নিচে রাখা হয়েছে আউটপুটে দেখানো মতে। একাধিক এলিমেন্ট থাকলে অ্যারে মত করে ইনডেক্স দিয়ে অ্যাক্সেস করতে হয়।

<html> <body> 
  <span>My span1</span> <span>My span2</span> <h2 id="H2">My Header</h2> 
  <script> 
    var s = document.getElementsByTagName("span")[1]; 
    var h = document.getElementById("H2"); 
    h.insertAdjacentElement("afterend", s); 
  </script> 
</body> </html>

আউটপুট

My span1 My Header My span2
  1. জাভাস্ক্রিপ্টে নির্দিষ্ট এলিমেন্টে ইভেন্ট হ্যান্ডলার কীভাবে যোগ করবেন

  2. জাভাস্ক্রিপ্ট দিয়ে পেরেন্ট এলিমেন্ট অ্যাক্সেস করা

  3. জাভাস্ক্রিপ্টে ID দিয়ে এলিমেন্ট রিমুভ করা

  4. C#-এ লিস্টের দ্বিতীয় পজিশনে উপাদান ইনসার্ট করা