prepend পদ্ধতি

prepend পদ্ধতি একটি এলিমেন্টের শুরুতে অন্য একটি এলিমেন্ট ঢোকানো সম্ভব করে। প্যারামিটার হিসেবে এটি সাধারণত createElement এর মাধ্যমে তৈরিকৃত এলিমেন্ট, অথবা একটি স্ট্রিং নেয়। একসাথে কয়েকটি এলিমেন্ট বা স্ট্রিং যোগ করা সম্ভব, কমা দিয়ে সেগুলো আলাদা করে দিলেই হয়।

সিনট্যাক্স

parent.prepend(element or string);

উদাহরণ

একটি প্যারাগ্রাফ তৈরি করা যাক, এটিতে টেক্সট সেট করা যাক এবং পৃষ্ঠায় #parent ব্লকের শুরুতে স্থাপন করা যাক:

<div id="parent">
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

let parent = document.querySelector('#parent');

let p = document.createElement('p');
p.textContent = '!';

parent.prepend(p);

কোড 실행ের ফলাফল:

<div id="parent">
	<p>!</p>
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

উদাহরণ

#parent ব্লকের শুরুতে একসাথে কয়েকটি প্যারাগ্রাফ স্থাপন করা যাক:

<div id="parent">
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

let parent = document.querySelector('#parent');

let p1 = document.createElement('p');
p1.textContent = 'a';

let p2 = document.createElement('p');
p2.textContent = 'b';

parent.prepend(p1, p2);

কোড 실행ের ফলাফল:

<div id="parent">
	<p>b</p>
	<p>a</p>
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

উদাহরণ

পদ্ধতির প্যারামিটার হিসেবে একটি স্ট্রিং ব্যবহার করা যাক:

<div id="parent">
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

let parent = document.querySelector('#parent');
parent.prepend('!');

কোড 실행ের ফলাফল:

<div id="parent">
	!
	<p>1</p>
	<p>2</p>
	<p>3</p>
</div>

আরও দেখুন

append পদ্ধতি,
যা এলিমেন্ট শেষে ঢোকায়
appendChild পদ্ধতি,
যা এলিমেন্ট শেষে ঢোকায়
insertBefore পদ্ধতি,
যা একটি এলিমেন্টের আগে এলিমেন্ট ঢোকায়
insertAdjacentElement পদ্ধতি,
যা নির্দিষ্ট স্থানে এলিমেন্ট ঢোকায়
insertAdjacentHTML পদ্ধতি,
যা নির্দিষ্ট স্থানে HTML ট্যাগ ঢোকায়