Element.prototype.matches can be used to check if an element includes a certain class (#tilPost)

To figure out if an element contains a particular class is a quite common operation when building interfaces. Today I came across an article by David Gilbterson which describes "15 HTML element methods you’ve potentially never …


This content originally appeared on Stefan Judis Web Development and was authored by Stefan Judis

To figure out if an element contains a particular class is a quite common operation when building interfaces. Today I came across an article by David Gilbterson which describes "15 HTML element methods you’ve potentially never heard of" and it introduced me to Element.prototype.matches. This element method can be used to check if an element includes a certain class and is way shorter than element.classList.contains. ?

const elem = document.querySelector('.foo');

elem.classList.contains('bar'); // true
elem.matches('.bar');           // true

Edited: It turns out matches also capable of dealing with several classes. (elem.matches('.foo, .bar') – "element matches .foo or .bar").


Reply to Stefan


This content originally appeared on Stefan Judis Web Development and was authored by Stefan Judis


Print Share Comment Cite Upload Translate Updates
APA

Stefan Judis | Sciencx (2018-07-15T22:00:00+00:00) Element.prototype.matches can be used to check if an element includes a certain class (#tilPost). Retrieved from https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/

MLA
" » Element.prototype.matches can be used to check if an element includes a certain class (#tilPost)." Stefan Judis | Sciencx - Sunday July 15, 2018, https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/
HARVARD
Stefan Judis | Sciencx Sunday July 15, 2018 » Element.prototype.matches can be used to check if an element includes a certain class (#tilPost)., viewed ,<https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/>
VANCOUVER
Stefan Judis | Sciencx - » Element.prototype.matches can be used to check if an element includes a certain class (#tilPost). [Internet]. [Accessed ]. Available from: https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/
CHICAGO
" » Element.prototype.matches can be used to check if an element includes a certain class (#tilPost)." Stefan Judis | Sciencx - Accessed . https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/
IEEE
" » Element.prototype.matches can be used to check if an element includes a certain class (#tilPost)." Stefan Judis | Sciencx [Online]. Available: https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/. [Accessed: ]
rf:citation
» Element.prototype.matches can be used to check if an element includes a certain class (#tilPost) | Stefan Judis | Sciencx | https://www.scien.cx/2018/07/15/element-prototype-matches-can-be-used-to-check-if-an-element-includes-a-certain-class-tilpost/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.