কম্পিউটার

HTML DOM সন্নিবেশ অ্যাডজাসেন্টএইচটিএমএল( ) পদ্ধতি


HTML DOM insertAdjacentHTML() পদ্ধতি একটি নির্দিষ্ট অবস্থানে HTML হিসাবে পাঠ্য স্ট্রিং সন্নিবেশ করায়।

সিনট্যাক্স

নিচের সিনট্যাক্স −

পজিশনস্ট্রিং এবং HTML কোডের প্যারামিটার সহ insertAdjacentHTML() কল করা হচ্ছে

node.insertAdjacentHTML(“positionString”, “htmlString”)

পজিশন স্ট্রিংস

এখানে, positionString নিম্নলিখিত −

হতে পারে
positionString বর্ণনা
শুরু করার পরে এটি নোড উপাদানের শুরুর পরে htmlString সন্নিবেশ করায়
পরবর্তীতে এটি নোড উপাদানের পরে htmlString সন্নিবেশ করায়
শুরু করার আগে এটি নোড উপাদানের আগে htmlString সন্নিবেশ করায়
আগে এটি নোড এলিমেন্ট শেষ হওয়ার আগে htmlString সন্নিবেশ করায়

এইচটিএমএল স্ট্রিংস

এবং, "htmlString" নিম্নলিখিত −

হতে পারে
positionString
নতুন স্প্যান অথবা

এটি একটি নতুন অনুচ্ছেদ


অথবা অন্য কোনো বৈধ html কোড

উদাহরণ

আসুন InsertAdjacentHTML()-এর উদাহরণ দেখি পদ্ধতি -

<!DOCTYPE html>
<html>
<head>
<title>insertAdjacentHTML()</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>insertAdjacentHTML( )</legend>
<h1>Family Tree</h1>
<span id="GrandFather">Grand Father --></span>
<span id="Father">Father --></span>
<span id="Myself">Myself</span>
<input type="button" onclick="rectifyTree()" value="Son is born">
</fieldset>
</form>
<script>
   function rectifyTree() {
      var MSpan = document.getElementById("Myself");
      MSpan.insertAdjacentHTML("afterend", "<span id='Son'>-->Son</span>");
   }
</script>
</body>
</html>

আউটপুট

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

তৈরি করবে

'পুত্র জন্মেছে ক্লিক করার আগে৷ ’ বোতাম -

HTML DOM সন্নিবেশ অ্যাডজাসেন্টএইচটিএমএল( ) পদ্ধতি

'পুত্র জন্মেছে ক্লিক করার পর৷ ’ বোতাম -

HTML DOM সন্নিবেশ অ্যাডজাসেন্টএইচটিএমএল( ) পদ্ধতি


  1. HTML DOM getElementById() পদ্ধতি

  2. HTML DOM getBoundingClientRect() পদ্ধতি

  3. এইচটিএমএল ডোমে রয়েছে অ্যাট্রিবিউটস() পদ্ধতি

  4. HTML DOM ফোকাস() পদ্ধতি