JavaScript හි විලාසිතා යෙදීම

අපි බොත්තමක් සාදමු, එය ක්ලික් කළ විට අංගය පෙන්වන හෝ සැඟවෙන සේ කරමු. පෙරනිමියෙන් අංගය සැඟවී ඇති ලෙස තබමු (මෙය ක්‍රියාත්මක කරන්න display: none භාවිතා කරමින්), එය පෙන්වන්නේ active පන්තිය එකතු කිරීමෙනි. මෙම පන්තිය අපි එකතු කරන හෝ ඉවත් කරන ආකාරයට classList.toggle භාවිතා කරමු:

<button id="button">මාව ක්ලික් කරන්න</button>
<div id="elem"></div>

#elem {
	display: none;
	width: 200px;
	height: 200px;
	border: 1px solid green;
}
#elem.active {
	display: block;
}

let button = document.querySelector('#button');
let elem = document.querySelector('#elem');

button.addEventListener('click', function() {
	elem.classList.toggle('active');
});