根據JS中的菜單項確定菜單項的大小

Question

我需要有一個菜單，該菜單中的項目會根據數量進行自我調整。 說，有三個項目。 每個容器的寬度約為容器的33％。 但是，如果有十個，每個將有10％。 有沒有人有任何想法/建議？ 謝謝！

Answer 1

通常，菜單是從無序列表構建的，並且父菜單元素具有id =“ menu”。在這種情況下，您將需要以下代碼：

menuElt = document.getElementById('menu');
childElements = menuElt.getElementsByTagName("li");
var quantity = childElements.length;
var widthPercent = Math.round(100/quantity);
for (var i = 0; i < quantity; i++) {
  childElements[i].style.width = widthPercent + "%";
}