javascript - 使用javascript使传单层控制面板响应

Question

我的 leaflet 层控件上的行太多，以至于它超出了页面。我如何使用 javascript 执行 below？

.leaflet-control-layers {
  overflow: auto;
}

我尝试过的

1. This answer

   var controls = L.control.layers(null,overlayMaps,{collapsed: false});  
   controls.addTo(map);  
   controls.style.overflow="auto";
   

   我知道控件没有 style 属性

2. 同一个问题的第二个答案

   document.getElementById("leaflet-control-layers").style.overflow="auto";
   

   什么都没发生

3. 不确定我从哪里得到这个，但我猜我的 map 中没有使用 jQuery

   $(".leaflet-control-layers").style.overflow="auto";
   

   因为这打印了 ReferenceError: $ is not defined 到控制台。

4. 来自 Modify CSS classes using Javascript 的已接受答案

       var layercontrols = document.querySelectorAll('.leaflet-control-layers');
       for(var i=0; i<layercontrols.length; i++){
           layercontrols[i].style.overflow="auto";
       }
   

   (什么也没发生)

Answer 1

如果您只是想将 div 的溢出设置为自动，我不明白为什么不能在 CSS 中这样做。但是我认为 .style.overflow 不起作用的原因是因为当“leaflet-control-layers”是类而不是 ID 时你执行了 document.getElementById()。