如何使用querySelectorAll

Question

我正在嘗試獲取具有相同類名的多個元素。 基本上，我喜歡復制導航菜單，因此在一個站點上有兩個相等的菜單。 如果單擊菜單1上的鏈接，則該操作應在菜單1和菜單2中發生。

我嘗試用queryselectorAll調用它們，但是沒有任何工作結果。

也許專業人士可以幫助我。

var menuEl = document.querySelectorAll('.menu');
document.mlmenu = new MLMenu(menuEl, {});

...

<!-- MENU 1 -->
<nav class="menu">
...
</nav>

<!-- MENU 2 -->
<nav class="menu">
...
</nav>

https://jsfiddle.net/m816o1ne/

Answer 1

document.querySelectorAll返回與指定選擇器組匹配的文檔內元素的列表（使用文檔節點的深度優先順序遍歷）。 返回的對象是NodeList。

因此，您可以通過以下方式使用它：

var menuEl = document.querySelectorAll('.menu');
for(var i=0;i<menuEl.length;i++){
  console.log(menuEl[i]);
}

要么

[].forEach.call(document.querySelectorAll('.menu'),function(elem){
  console.log(elem);
})