在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 = '';