JQuery & selecting Elements.
2 min readSep 23, 2020
JQuery-Selectors
- you can always select your element easily by using the Jquery(‘’) or $(‘’) to bring up the values with said id (#) or class (.)
- you can access by including the html element type in string for the id or class method
- you can use an ancestor descendent method including the parent element and the descendent for all those descendants
- the child selector is only going to select the child nodes and not reference any nested values (‘parent > child’)
- if you want to go up in scope you can call .parent() or my preferred method is using .closest() with the element I’m looking for
- when not using ES6 you can access values with the keyword this
- to select every element on the page use (“*”)
// in this instance it would apply css styling to both all divs<body><div>DIV1</div><div>DIV2</div><span>SPAN</span><script>$( "div" ).css( "border", "5px pink" );</script></body></html>
What’s happening?
Whenever JQuery is ran its grabbing the pages element making DOM changes, if you have multiple types that fit your said selectors it is going to apply your operation to every values its connected to by said element id or class attribute.
Why would I use this?
I could just manually code the html couldn’t I? by all means it’s possible but for operating with JS and creating repetitive tasks it’s so much easier and put together to use selectors to access every value available in our DOM.
