Check if an element has a specified class

Javascript இல் ஒரு குறிப்பிட்ட element இல் ஒரு class ஆனது அமைந்துள்ளதா என்பதை கண்டறிய பயன்படுகிறது. இங்கு classList இல் இருக்கும் contains என்ற method ஆனது குறிப்பிட்ட element இல் class ஆனது அமைந்துள்ளதா என்பதை கண்டறிய பயன்படுகிறது.

element.classList.contains('classname');

Note: இங்கு javascript இல் இருக்கும் classList இல் contains என்ற method ஆனது ஒரு classname ஐ argument ஆக accept செய்கிறது. இங்கு இந்த classname ஐ வைத்துகொண்டு அந்த class ஆனது குறிப்பிட்ட element இல் அமைந்துள்ளதா என்பதை கண்டறிய பயன்படுகிறது. இங்கு முதலில் element ஐ select செய்து பிறகு class ஆனது அமைந்துள்ளதா என்பதை கண்டறியலாம்.

Example1


<html>
<body>
<div id="content" class="parallel codes">JavaScript classList</div>
<script>
       let div = document.querySelector('#content');
       document.writeln(div.classList.contains('parallel'));
</script>
</body>
</html>

மேலே உள்ள Example1-ஐ கவனிக்கவும் இங்கு html tag கள் கொடுகப்பட்டுள்ளது. இங்கு document.querySelector('#content') என்ற முறையை பயன்படுத்தி content என்ற id கொண்ட ஒரு element ஐ select செய்து கொள்கிறோம். பிறகு அதனை div என்ற variable இல் store செய்து கொள்கிறோம். இங்கு div.classList.contains('parallel') என்ற contains function மூலம் parallel என்ற class ஆனது நாம் select செய்த element இல் உள்ளதா என்பதை கண்டறிய பயன்படுகிறது. இங்கு class ஆனது உள்ளது எனவே true என return செய்கிறது.

Output:

true

Example2


<html>
<body>
<div id="content" class="linto website learn">JavaScript classList</div>
<script>
       let div = document.querySelector('#content');
       document.writeln(div.classList.contains('test'));
</script>
</body>
</html>

மேலே உள்ள Example2-ஐ கவனிக்கவும் இங்கு html tag கள் கொடுகப்பட்டுள்ளது. இங்கு document.querySelector('#content') என்ற முறையை பயன்படுத்தி content என்ற id கொண்ட ஒரு element ஐ select செய்து கொள்கிறோம். பிறகு அதனை div என்ற variable இல் store செய்து கொள்கிறோம். இங்கு div.classList.contains('test') என்ற contains function மூலம் parallel என்ற class ஆனது நாம் select செய்த element இல் உள்ளதா என்பதை கண்டறிய பயன்படுகிறது. இங்கு class ஆனது உள்ளது எனவே false என return செய்கிறது.

Output:

false

Comments