javascript - 在 div 中搜索元素

Question

我正在尝试为div包含多个图像的搜索栏。我有搜索工作，但是当它隐藏不适合搜索的元素时，元素之间只有空格。我想要发生的是让剩余的元素彼此重新定位。我做了一个jsFiddle来展示我到目前为止所拥有的。尝试在搜索字段中输入“a”或“b”，您就会明白我的意思。

谢谢你的帮助。

Answer 1

使用display: none而不是visibility: hidden.

---

• display: none从 DOM 中移除元素。例子：

  .cheshire_cat {
      display: none;
  }
  

  该元素将完全消失，就像它不存在一样。

• visibility: hidden就像元素是完全透明的一样。例子：

  .ninja {
      color: black;
      visibility: hidden;
  }
  

  该元素仍将存在，在相同的位置，占据相同的空间，但您将无法看到它。

Answer 2

改变这个

objects[i].style.visibility = 'hidden';

对此

objects[i].style.display = 'none';

并再次显示图像

objects[i].style.display = '';