Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialKen Okiebisu
9,673 PointsChanging text fields to checkboxes
I have question on why this is wrong. I used query selector to select all the elements which is different from the solution in the video. The video used the getElementsByTagName and looped it.
// 6: Change all <input> elements from text fields to checkboxes const allInputElements = document.querySelectorAll('input'); allInputElements.type = 'checkbox';
4 Answers
Steven Parker
231,275 PointsWith appropriate arguments, "querySelectorAll
" should be an effective substitute for "getElementsByTagName
".
But either way, you can't assign the "type" attribute of all the elements of a collection with a single operation. You'd need to loop through the collection and assign them individually.
Harald N
15,843 Pointsmy solution to looping over the input's with the querySelectorAll is this:
let allInputElements = document.querySelectorAll('input');
for (let i = 0; i<allInputElements.length; i++) {
allInputElements[i].type = 'checkbox';
}
This is the same as in the video, the only difference is that you made a list with the input elements with the query selector instead of getElementsByTagName.
Hope this helps.
Ken Okiebisu
9,673 PointsThanks for the reply. I see. So then if I can loop through the elements using the querySelectorAll somehow then would it be a sufficient way to change the type attributes?
Steven Parker
231,275 PointsBoth "querySelectorAll"and "getElementsByTagName" give you an iterable collection that you can use in a loop.
Ken Okiebisu
9,673 PointsI see. I will trying searching for a way to use querySelectorAll to iterate over the elements. Thanks for the answers.
Steven Parker
231,275 PointsBesides using it in a loop, you can also apply the "forEach" method to it.
Ken Okiebisu — If your original question has been answered, you can mark it solved by choosing a "best answer".
And happy coding!