根据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 + "%";
}