ජවාස්ක්රිප්ට් හි දාම වල වාසි සහ අවාසි
දාම කේතය කෙටි කරන්නේ නමුත්,
බොහෝ අවස්ථාවල දී විචල්යයක් හඳුන්වා දීම
තවමත් පහසු වේ. උදාහරණ දෙක සංසන්දනය කරන්න -
දැන් මම elem විචල්යය හඳුන්වා දී
ඕනෑම ගණනක ගුණාංග ලිවිය හැකිය,
මෙයින් querySelector ක්රමය එක් වරක් පමණක්
කැඳවනු ලැබේ:
let elem = document.querySelector('#elem');
elem.value = 'www';
elem.type = 'submit';
දැන් මම නව විචල්යයක් හඳුන්වා නොදී එම නිසා
මට querySelector ක්රමය දෙවරක්
කැඳවීමට සිදුවේ:
document.querySelector('#elem').value = 'www';
document.querySelector('#elem').type = 'submit';
මගේ අදහසට, මෙම කේතය කඩිසර වුවත්
රේඛාවකින් අඩු ගනනක් ගනී. ඊට අමතරව,
මට id හි අගය 'elem' වෙනස් කිරීමට
අවශ්ය නම්, එය වෙනත් ඕනෑම අගයකට වෙනස් කිරීමට සිදුවනු ඇත.
එය බොහෝ ස්ථානවල කළ යුතු අතර එය ඉතා පහසු නොවේ.
තවත් ගැටලුවක් තිබේ - බ්රවුසරය මත ඇති බර.
පිටුවේ මූලද්රව්ය සෙවීම, එය කරන
querySelector ක්රමය, ඉතාමත්
මන්දගාමී ක්රියාවකි (සහ සාමාන්යයෙන් පිටුවේ මූලද්රව්ය සමඟ කිසිදු කාර්යයක්
- මෙය මන්දගාමී ක්රියාවකි
- මෙය මතක තබා ගන්න).
අපගේ නඩුවේ, අපි සෑම විටම
querySelector භාවිතා කරන්නේ නම්, බ්රවුසරය සෑම විටම
HTML පිටුව සකස් කර නිශ්චිත
id සහිත මූලද්රව්යය සෙවීමට
වර කිහිපයක් ගතවනු ඇත
(id සමාන වේ නම් කමක් නැත - බ්රවුසරය
සියලු ක්රියාවන් වර කිහිපයක් කරනු ඇත), අනවශ්ය
ක්රියාවන් සිදු කරමින්, ඒවා
බ්රවුසරයේ කාර්යය මන්දගාමී කළ හැකිය.
අපි elem විචල්යය භාවිතා කරන්නේ නම්
- පිටුවේ සෙවීමක් සිදු නොවේ
(මූලද්රව්යය දැනටමත් හමු වී ඇති අතර එයට යොමු කිරීම
විචල්යයේ තබා ඇත).
පහත කේතය දෙනු ලැබේ:
<img id="image" src="avatar.png" width="300" height="500">
console.log(document.querySelector('#image').src);
console.log(document.querySelector('#image').width);
console.log(document.querySelector('#image').height);
මෙම කේතයේ අඩුපාඩු සඳහන් කරන්න. ඒවා නිවැරදි කරන්න.
