after মেথড

after মেথডটি নির্দিষ্ট এলিমেন্টের পরে টেক্সট যোগ করে। এছাড়াও insertAfter নামক একটি মেথড রয়েছে, যা একইভাবে কাজ করে।

সিনট্যাক্স

এলিমেন্টের পরে টেক্সট ঢোকানো:

javascript$(সিলেক্টর).after(টেক্সট);

এভাবে নির্বাচিত এলিমেন্টগুলির পরে সেই টেক্সটটি যোগ করা হবে, যা ব্যবহারকারী-সংজ্ঞায়িত ফাংশন দ্বারা রিটার্ন করা হয়। ফাংশনটি কল করা হয় নির্বাচিত প্রতিটি এলিমেন্টের জন্য আলাদাভাবে। এই ফাংশনের প্রথম প্যারামিটার এ আসে নির্বাচিত এলিমেন্টগুলির সেটে প্রতিটির ইন্ডেক্স নম্বর (পর্যায়ক্রমে), দ্বিতীয়টিতে - এলিমেন্টের বর্তমান কনটেন্ট:

javascript$(সিলেক্টর).after(function(সেটে ইন্ডেক্স নম্বর, এলিমেন্টের বর্তমান কনটেন্ট));

টেক্সট শুধুমাত্র সাধারণ টেক্সটই নয় হতে পারে, এটি একটি DOM এলিমেন্ট বা jQuery অবজেক্টও হতে পারে। এই ক্ষেত্রে, এই এলিমেন্টগুলি তাদের HTML কোডের অবস্থান থেকে সরিয়ে নিয়ে যাবে।

উদাহরণ

চলুন নির্দিষ্ট প্যারাগ্রাফের পরে কিছু টেক্সট ঢোকাই:

html<p id="test">text</p>

javascript$('#test').after('!!!');

HTML কোডটি এমন দেখাবে:

html<p id="test">text</p>!!!

উদাহরণ

চলুন নির্দিষ্ট প্যারাগ্রাফের পরে ট্যাগ সহ টেক্সট ঢোকাই:

html<p id="test">text</p>

javascript$('#test').after('<p>!!!</p>');

HTML কোডটি এমন দেখাবে:

html<p id="test">text</p><p>!!!</p>

উদাহরণ

চলুন একটি প্যারাগ্রাফকে অন্যটির নিচে নিয়ে যাই (অর্থাৎ, পুরানো জায়গা থেকে প্যারাগ্রাফটি কেটে নতুন জায়গায় রাখি):

html<p id="p1">text1</p>
<p id="p2">text2</p>

javascript$('#p1').after($('#p2'));

HTML কোডটি এমন দেখাবে:

html<p id="p1">text1</p>
<p id="p2">text2</p>

আরও দেখুন