在html或者vue中隐藏（或展现）多个div

document.querySelector()

方法返回匹配指定选择器的第一个元素。如果没有找到，则返回 null。所以如果满足条件的元素有多个，那么它只会返回第一个。

document.querySelectorAll()

该方法和 document.querySelector()用法类似，不同的是它会将符合条件的多个（或者一个）元素封装到一个数组中返回

那么如果想要一次获取多个div进行操作怎么办呢？

这里用在html中隐藏多个div为例来操作一下。

假设要隐藏类名class = “text” 的块（类名class = “text” 的块有多个，一个应该也行，但是就没必要用这个方法了）

在<script>中加入以下方法，该方法可以绑定一个点击事件

fun1: function (e) {
      let table1 = document.querySelectorAll(".text")
      for (let i = 0; i < table1.length; i++) {
        table1[i].style.display = 'none'
      }
    },

 相当于用querySelectorAll()获取了含有符合条件的元素的数组，再用for遍历，将它们一一隐藏，

隐藏某个块的代码：

某个块.style.display = "none"

展现某个块代码：

某个块.style.display = "block"

 

 如果只需要隐藏一个div块，那就不用for来遍历了，直接用document.querySelector()获取这个块，然后用上面的代码隐藏就行了。

展现一个div同理。

ps：我也不是特别懂555，如果写错了哪里请大家告诉我我来修改，这个是我之前遇到的问题，担心自己忘了，所以写一篇来记录一下。