html ක්රමය
html ක්රමය මඟින් මූලද්රව්යයේ පෙළ
වෙනස් කිරීමට සහ අනුඅකුරු සමඟ එය ලබා ගැනීමට ඉඩ සලසයි.
වාක්ය රචනය
පෙළ ලබා ගැනීම:
$(තෝරන්නා).html();
පෙළ වෙනස් කිරීම:
$(තෝරන්නා).html(නව පෙළ);
අමතරව
html ක්රමයට කට්ටලයක ඇති සෑම මූලද්රව්යයකටම
දෙන ලද ශ්රිතය යෙදිය හැකිය.
මෙහිදී පළමු පරාමිතිය ලෙස ශ්රිතයට ලැබෙන්නේ
කට්ටලය තුළ මූලද්රව්යයේ අංකය වන අතර, දෙවන පරාමිතිය
ලෙස - මූලද්රව්යයේ වත්මන් පෙළ:
$(තෝරන්නා).html(function(කට්ටලයේ අංකය, මූලද්රව්යයේ වත්මන් පෙළ));
ශ්රිතය තුළ විචල්ය නාම ඕනෑම ආකාරයකින් තිබිය හැකිය.
උදාහරණයක් ලෙස, පළමු පරාමිතිය සඳහා අපි නමක් ලබා දෙන්නේ නම්
index - එවිට අපගේ ශ්රිතය තුළට ප්රවේශ විය හැකි වනු ඇත
index විචල්යය, එහි ඇති වනු ඇති අංකය
ශ්රිතය එකලස් කරන මූලද්රව්යය සඳහා කට්ටලය
දැනට කාලය තුළ.ඒ හා සමානව, දෙවන
පරාමිතිය සඳහා ලබා දීමට, උදාහරණයක් ලෙස, නම value - එවිට
අපගේ ශ්රිතය තුළට ප්රවේශ විය හැකි වනු ඇත value විචල්යය,
එහි ඇති වනු ඇති පෙළ ශ්රිතය
දැනට කාලය තුළ එකලස් කරන මූලද්රව්යය:
$(තෝරන්නා).html(function(index, value) {
// මෙහි index සහ value විචල්ය ප්රවේශ විය හැකිය
});
සෑම මූලද්රව්යයකම පෙළ වෙනස් වනු ඇත, ශ්රිතය එම මූලද්රව්යය සඳහා විශේෂයෙන් ආපසු ලබා දෙන මූලද්රව්යය.
උදාහරණය
අපි අපේ ඡේදයේ අන්තර්ගතය තිරය මත පෙන්වමු:
<p id="test">පෙළ</p>
let text = $('#test').html();
alert(text);
උදාහරණය
අපි අපේ ඡේදයේ අන්තර්ගතය වෙනස් කරමු:
<p id="test">පෙළ1</p>
$('#test').html('පෙළ2');
HTML කේතය මේ ආකාරයෙන් පෙනෙනු ඇත:
<p id="test">පෙළ2</p>
උදාහරණය
අපි අපේ ඡේදයේ අන්තර්ගතය වෙනස් කරමු අනුඅකුරු සහිත පෙළට:
<p id="test">පෙළ1</p>
$('#test').html('<span>පෙළ2</span>');
HTML කේතය මේ ආකාරයෙන් පෙනෙනු ඇත:
<p id="test"><span>පෙළ2</span></p>
උදාහරණය
අපි සෑම ඡේදයකටම එහි අවසානයේ එකතු කරමු කට්ටලය තුළ එහි අනුක්රමික අංකය:
<p>පෙළ</p>
<p>පෙළ</p>
<p>පෙළ</p>
$('p').html(function(index, value){
return value + ' ' + index;
});
HTML කේතය මේ ආකාරයෙන් පෙනෙනු ඇත:
<p>පෙළ 0</p>
<p>පෙළ 1</p>
<p>පෙළ 2</p>
