javascript getElementById和InnerHTML仅针对html运行一次

我正在尝试为我的html代码创建一个简单的标题间隔符，这样我就不必键入太多的“ ”，因此代码看起来更容易阅读。但是，我创建了以下内容：

$(function() {
    var subSpace = document.getElementById("subSpace");
    var titleName = document.getElementById("subSpace").value;
    subSpace.innerHTML = "          " + titleName;
    return false;
});

但它只针对此代码运行一次：

<li><a href="#" id="subSpace" value="Start Menu"     ></a></li>
<li><a href="#" id="subSpace" value="Tiles"      ></a></li>
<li><a href="#" id="subSpace" value="Action Center" ></a></li>
<li><a href="#" id="subSpace" value="Settings"       ></a></li>
<li><a href="#" id="subSpace" value="Customizations"></a></li>
<li><a href="#" id="subSpace" value="Windows Search"></a></li>
<li><a href="#" id="subSpace" value="Microsoft Edge"></a></li>

因此，它运行“开始”菜单，并按照我想要的方式适当地隔开它，但不运行互动程序、动作中心等。有没有办法解决这个问题？我错过什么了吗？我可能离这里很远，因为我还在学习。

---

提前谢谢你

这是因为您有多个id为

子空间的元素。您应该只使用一次id。如果有多个元素具有相同的id，则仅匹配第一个元素

另外，另一方面，您应该真正使用
CSS
来设置页面样式（即添加间隔符/页边距/填充）。
这是因为您有多个id为
子空间的元素。您应该只使用一次id。如果有多个元素具有相同的id，则仅匹配第一个元素

另外，在旁注中，您应该真正使用
CSS
来设计页面样式（即添加间隔符/页边距/填充）。
您应该使用类而不是ID，因为ID应该是唯一的。除此之外，您还可以使用CSS在左侧添加填充：


子空间{
左侧填充：10px；
}






您应该使用类而不是ID，因为ID应该是唯一的。除此之外，您还可以使用CSS在左侧添加填充：


子空间{
左侧填充：10px；
}






您有重复的
id
s。如果需要选择多个元素，请使用
class
。您可以使用JQuery选择它们

<a href="#" id="subSpace" value="Start Menu" class="subSpace">

我在这里看到了另一个答案，它建议了一种更好的方法，只使用CSS。你也应该考虑这个问题。
 你有重复代码<代码> ID <代码> s。如果需要选择多个元素，请使用
class
。您可以使用JQuery选择它们

<a href="#" id="subSpace" value="Start Menu" class="subSpace">

我在这里看到了另一个答案，它建议了一种更好的方法，只使用CSS。你也应该考虑这一点。
 IDS被假定为唯一的，所以它只是拾取它所找到的第一个子空间。为什么你不使用元素的样式而不是空白？因此，它只拾取找到的第一个“子空间”。为什么不在元素样式上使用
padding left
属性而不是空格？您确定它的定义与第一个匹配吗？我认为双应用ID是非法的。它可能不是这样定义的，但它通常是这样工作的。你确定它的定义与第一个匹配吗？我认为双重身份证是非法的。它可能不是这样定义的，但它通常是这样工作的。