相同类名但不是同级别的最后一个元素,如何选择具有相同类名的所有元素？

I have a Boolean variable. It is stored in a hidden input field. Basically, if the user is signed in, it is false, if not, it is true.

There are download buttons which will link to a file download. My aim is to make it so that, if they aren't signed in, the button will not show, and the link will not work (it would be nice to have an alert saying they need to sign in or something, but that would probably be more effort than it's worth).

I have a function that performs onload of body:

function hide_download_btns(){

if (document.getElementById('download_btn_var_input').value == "true") {

document.getElementsByClassName('project_download_btn').item(0).hidden = true

}

}

My problem is where it asks for the nth term .item(0). This is where it selects the div on which to perform the function, however, I want the function to affect all divs with the class name 'project_download_btn'.

I'm not a fan of jQuery, so it would be great to avoid that if possible.

解决方案

You can simply loop through the elements instead of just taking the 0th.

var buttons = document.getElementsByClassName('project_download_btn');

for(var i=0; i< buttons.length; i++){

buttons[i].hidden = true;

}