скрыть все элементы с идентификатором

Question

Я хочу скрыть все элементы с id = showhide

Поэтому я установил свой javascript как

<script type="text/javascript">

    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
</script>
</body>

, а затем мою кнопку как

<a href="#" onclick="toggle_visibility('showhide');">
                            <button>Show / Hide Details</button>
                            </a>

Затем я добавил идентификатор в таблицу, но он скрывает только первый экземпляр этого идентификатора, а не все?

Answer 1

Как уже упоминалось, вам нужно использовать класс вместо id. getElementById возвращает только один элемент, а getElementsByClassName возвращает коллекцию всех элементов (NodeList) с этим классом. Я прикрепил фрагмент, демонстрирующий, как может выглядеть код.

function toggle_visibility(className) {
  const elements = document.getElementsByClassName(className);
  for (const e of elements) {
    e.style.display = e.style.display === 'none' ? 'block' : 'none';
  }
}

<button onclick="toggle_visibility('showhide');">
  Show / Hide Details
</button>

<div class="showhide">A</div>
<div class="showhide">B</div>
<div class="showhide">C</div>

Answer 2

Ну, лучший способ сделать это - использовать getElementsByClassName():

function toggle_visibility(class) {
var elements = getElementsByClassName("showhide");
for (e of elements) {
    if (elements[e].style.display == "block") {
          elements[e].style.display = "none";
    }else {
          element[e].style.display = "block";
    }
}
}

и добавьте этот класс к строкам или к чему угодно, чтобы кнопка переключала видимость.

Answer 3

Вы не можете использовать id для этих целей. ID по его идеологии должен быть SINGLUAR в вашем html. Например, вы можете использовать классы и document.getElementsByClassName Или вы можете использовать некоторые специфические атрибуты, более удобные для вас, кроме идентификаторов.