HTML DOM insertBefore() মেথড

ওভারভিউ

HTML DOM insertBefore() মেথড একটি নতুন নোডকে ইতিমধ্যে বিদ্যমান চাইল্ড নোডের আগে সংযোজন করে।

সিনট্যাক্স

node.insertBefore(newNode, existingNode)

প্যারামিটারস

প্যারামিটারস	বিবরণ
newNode	নতুন তৈরি চাইল্ড নোড যা শুরুতে অ্যাপেন্ড করা হবে।
existingNode	ইতিমধ্যে বিদ্যমান নোড।

উদাহরণ

InsertBefore() মেথডের উদাহরণ:

<!DOCTYPE html> <html> <head> <title>insertBefore()</title> <style>    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    ol {       width:30%;       margin: 0 auto;    } </style> </head> <body> <form> <fieldset> <legend>insertBefore( )</legend> <h1>How to make tea</h1> <h3>Steps:</h3> <ol id="stepList"> <li>Add Tea Bag</li> <li>Add Sugar</li> <li>Add Milk</li> </ol> <input type="button" onclick="addStep()" value="Add"> </fieldset> </form> <script>    function addStep() {       var newIngredient = document.createElement("LI");       var textnode = document.createTextNode("Boil Water");       newIngredient.appendChild(textnode);       var stepList = document.getElementById("stepList");       stepList.insertBefore(newIngredient, stepList.childNodes[0]);    } </script> </body> </html>

আউটপুট

'Add' বাটনে ক্লিক করার আগে:

HTML DOM insertBefore() মেথড

'Add' বাটনে ক্লিক করার পর:

HTML DOM insertBefore() মেথড