Javascript style.display 带走了 <ul> 项目符号答案

【问题标题】：Javascript style.display taking away <ul> bulletsJavascript style.display 带走了 <ul> 项目符号
【发布时间】：2015-11-19 00:00:39
【问题描述】：

稍加注释后，我发现当我在 JavaScript 中运行此命令时，我的无序列表中的项目符号消失了（每个“页面”都是我的无序列表中的一个项目。）：

pages[i].style.display = "block";

但是，ul 的填充保持不变。如何在不删除项目符号的情况下切换列表项的style.display？

【问题讨论】：

一个 jsfiddle 会很有用
任何更多细节会很有用。 pages[i] 是什么？是<ul> 还是<li> 还是别的什么？这听起来像 ul 因为你说 "The padding of the ul"，但是 ul 通常是 display:block 而 li 通常是 display:list-item

【解决方案1】：

然后改为设置display to list-item（这是li 元素的默认值）。

在你的情况下，它会是：

pages[i].style.display = 'list-item';

【讨论】：

【解决方案2】：

如果要将其恢复到以前的外观，可以使用display: list-item 或element.style.display = "list-item"。

如果你只在 JavaScript 中这样设置样式：

element.style.display = 'none';

您可以删除内联样式并将其重置为初始状态，方法是将其设置为空字符串：

element.style.display = '';

这将为<li> 元素恢复display: list-item，为<span> 元素恢复display: inline，为<table> 元素恢复display: table，等等。

【讨论】：