JavaScript හි ගුණාංග ලෙස ටැග් ගුණාංග

දැන් අපි ටැග් වල ගුණාංග ලබා ගන්නේ කෙසේදැයි ඉගෙන ගනිමු. මෙහි පහත නියමය අදාළ වේ: ටැගයේ එක් එක් ගුණාංගය සඳහා DOM මූලද්‍රව්‍යයේ එකම නමින් ගුණයක් අනුරූප වේ.

අපි උදාහරණයක් බලමු. අපට මේ වගේ ටැගයක් ඇති බවට සිතමු:

html<input id="elem" type="text">

අපගේ මූලද්‍රව්‍යයට විචල්‍යයකට සබැඳියක් ලබා ගනිමු:

javascriptlet elem = document.querySelector('#elem');

අවශ්‍ය ගුණාංගවල අගයන් ප්‍රතිදානය කරමු:

javascriptconsole.log(elem.id);   // 'elem' ප්‍රතිදානය කරයි
console.log(elem.type); // 'text' ප්‍රතිදානය කරයි

දැන් උදාහරණය සඳහා ගුණාංගයේ අගය වෙනස් කරමු:

javascriptelem.type = 'submit';
Задание 1

පහත ආදාන ක්ෂේත්‍රය ලබා දී ඇත:

html<input id="elem" type="email">

බොත්තමක් ද ලබා දී ඇත. බොත්තම මත ක්ලික් කිරීමෙන්, ඉහත සඳහන් කළ ආදාන ක්ෂේත්‍රයේ type ගුණාංගයේ අන්තර්ගතය පරිදර්ශකය මත ප්‍රතිදානය කරන්න.

Задание 2

පහත ආදාන ක්ෂේත්‍රය ලබා දී ඇත:

html<input id="elem" type="email">

බොත්තමක් ද ලබා දී ඇත. බොත්තම මත ක්ලික් කිරීමෙන්, type ගුණාංගයට submit අගය ලියන්න.

Задание 3

ඔබට a ටැගයක් ලෙස සබැඳියක්, බොත්තමක් සහ ඡේදයක් ඇතැයි සිතමු. බොත්තම මත ක්ලික් කිරීමෙන්, සබැඳියේ href ගුණාංගයේ අන්තර්ගතය ඡේදය තුළට ප්‍රතිදානය කරන්න.

Задание 4

ඔබට සබැඳියක් සහ බොත්තමක් ඇතැයි සිතමු. බොත්තම මත ක්ලික් කිරීමෙන්, සබැඳියේ පෙළ අවසානයට එහි href ගුණාංගයේ අන්තර්ගතය වරහන් තුළ එකතු කරන්න.

Задание 5

ඔබට රූපයක් ඇතැයි සිතමු. එය img ටැගය භාවිතා කරමින් පිටුවේ තබන්න. බොත්තමක් සහ ඡේදයක් ද ලබා දී ඇතැයි සිතමු. බොත්තම මත ක්ලික් කිරීමෙන්, රූපයේ src ගුණාංගයෙන් රූපයට ගමන් පථය ඡේදයට ලියා තැබෙන ආකාරයට සකසන්න.

Задание 6

img ටැගයක රූපයක් සහ බොත්තමක් ලබා දී ඇත. බොත්තම මත ක්ලික් කිරීමෙන්, width ගුණාංගයට 300 අගය ලියන්න.

Задание 7

img ටැගයක රූපයක් සහ බොත්තමක් ලබා දී ඇත. width ගුණාංගයේ යම් පළලක් නියම කර ඇතැයි සිතමු. ක්ලික් කිරීමෙන් රූපයේ පළල 2 ගුණයකින් වැඩි කරන බොත්තම සාදන්න.

Задание 8

ඔබට රූප දෙකක් ඇතැයි සිතමු. පිටුවේ img ටැගයක් සහ බොත්තම් දෙකක් සාදන්න. පළමු බොත්තම මත ක්ලික් කිරීමෙන්, src ගුණාංගයට පළමු රූපයට ගමන් පථය ලියන්න, දෙවන බොත්තම මත ක්ලික් කිරීමෙන් දෙවන රූපයට ගමන් පථය ලියන්න.