html মেথড
html মেথডটি এলিমেন্টের টেক্সট
পরিবর্তন করতে এবং এটি ট্যাগ সহ পেতে দেয়।
সিনট্যাক্স
টেক্সট পাওয়া:
$(সিলেক্টর).html();
টেক্সট পরিবর্তন:
$(সিলেক্টর).html(নতুন টেক্সট);
অতিরিক্ত তথ্য
html মেথডটি সেটের প্রতিটি এলিমেন্টে
একটি নির্দিষ্ট ফাংশন প্রয়োগ করতে পারে।
এক্ষেত্রে ফাংশনটি প্রথম প্যারামিটার হিসাবে পাবে
সেটে এলিমেন্টের নম্বর, এবং দ্বিতীয় প্যারামিটার হিসাবে
- এলিমেন্টের বর্তমান টেক্সট:
$(সিলেক্টর).html(function(সেটে নম্বর, এলিমেন্টের বর্তমান টেক্সট));
ফাংশনে ভেরিয়েবলের নাম যেকোনো হতে পারে।
উদাহরণস্বরূপ, যদি প্রথম প্যারামিটারের জন্য আমরা নাম দিই
index - তাহলে আমাদের ফাংশনের ভিতরে অ্যাক্সেস থাকবে
index ভেরিয়েবলটিতে, যাতে থাকবে সেই এলিমেন্টের সেটে নম্বর
যেটি ফাংশনটি বর্তমানে প্রসেস করছে। একইভাবে, যদি দ্বিতীয়
প্যারামিটারের জন্য, উদাহরণস্বরূপ, নাম দিই value - তাহলে
আমাদের ফাংশনের ভিতরে অ্যাক্সেস থাকবে value ভেরিয়েবলটিতে,
যাতে থাকবে সেই এলিমেন্টের টেক্সট যেটি ফাংশনটি
বর্তমানে প্রসেস করছে:
$(সিলেক্টর).html(function(index, value) {
// এখানে index এবং value ভেরিয়েবলগুলি অ্যাক্সেসযোগ্য
});
প্রতিটি এলিমেন্টের টেক্সট সেই টেক্সটে পরিবর্তিত হবে, যেটি ফাংশনটি এই বিশেষ এলিমেন্টের জন্য রিটার্ন করে।
উদাহরণ
আসুন আমাদের প্যারাগ্রাফের বিষয়বস্তু স্ক্রীনে প্রদর্শন করি:
<p id="test">text</p>
let text = $('#test').html();
alert(text);
উদাহরণ
আসুন আমাদের প্যারাগ্রাফের বিষয়বস্তু পরিবর্তন করি:
<p id="test">text1</p>
$('#test').html('text2');
HTML কোডটি এইরকম দেখাবে:
<p id="test">text2</p>
উদাহরণ
আসুন আমাদের প্যারাগ্রাফের বিষয়বস্তু ট্যাগ সহ টেক্সটে পরিবর্তন করি:
<p id="test">text1</p>
$('#test').html('<span>text2</span>');
HTML কোডটি এইরকম দেখাবে:
<p id="test"><span>text2</span></p>
উদাহরণ
আসুন প্রতিটি প্যারাগ্রাফের শেষে এর সেটে ক্রমিক নম্বর যোগ করি:
<p>text</p>
<p>text</p>
<p>text</p>
$('p').html(function(index, value){
return value + ' ' + index;
});
HTML কোডটি এইরকম দেখাবে:
<p>text 0</p>
<p>text 1</p>
<p>text 2</p>
