এলিমেন্ট সন্নিবেশ করার সময় ইভেন্ট বাইন্ডিং

আসুন এখন এলিমেন্ট সন্নিবেশ করার সময় সেগুলিতে ইভেন্ট হ্যান্ডলারগুলি বাইন্ড করি।

ধরুন, উদাহরণস্বরূপ, আমাদের কাছে এইরকম একটি প্যারেন্ট এলিমেন্ট আছে:

<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 = '!';

p.addEventListener('click', function() {
	console.log(this.textContent); // ক্লিক করলে প্যারাগ্রাফের টেক্সট প্রদর্শিত হবে
});

parent.appendChild(p);

একটি ol এবং একটি বাটন দেওয়া আছে। এমন করুন যাতে বাটনে ক্লিক করলে ol-এর শেষে একটি li ট্যাগ যোগ হয়। এমন করুন যাতে যোগ করা যেকোনো li-এ ক্লিক করলে তার টেক্সটের শেষে একটি বিস্ময়বোধক চিহ্ন যুক্ত হয়।