Javascript 动态css类属性？

我有一个导航栏，其元素使用Struts2

iterator

标记呈现，如下所示：

<ul>
    <li><a href="#">Home</a></li>

<s:iterator var="row" value="#session.PrivMenu.children" status="stat">         
    <li>
        <a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>">
            <s:property value="#row.moduleName"/>
        </a>
    </li>
</s:iterator>  

</ul>

---

但我想以后如果模块名改变，我也必须编辑css。我做错了吗？？？有更好的主意吗？

您可以在其中添加一个类，然后使用css添加一个图标。在css中，您可以使用“第n个子”选择器为每个标签添加不同的图标

请参阅：w3schools.com/cssref/sel_nth-child.asp了解更多信息

使用选择器可以为每个a标记设置背景。示例：如果您有7个链接，并希望设置第5个后台链接，请使用：

---

.MyNavBar a:n个孩子（7n+5）{宽度：50px；背景图像：url（'MyImageurl'）；}

如果您想使用n个孩子，它不适用于ie8或更低版本的浏览器。 另一种可能性（如果菜单结构不变）是在li上使用带有计数器的唯一类

然后使用正确的css设计菜单

如果您有可能使用计数器，您可以使用如下：

<ul>
  <li class="menu-1"><a href="#">Home</a></li>
  <s:iterator var="row" value="#session.PrivMenu.children" status="stat">
    <li class="menu-2"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>">
      <s:property value="#row.moduleName"/></a>
    </li>                       
  </s:iterator>
  <s:iterator var="row" value="#session.PrivMenu.children" status="stat">
    <li class="menu-3"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>">
      <s:property value="#row.moduleName"/></a>
    </li>                       
  </s:iterator>    
</ul>

从什么html到你想要什么html……由迭代器标记呈现的锚定标记。这个问题被问错了。moduleName最终更改名称的原因和方式？它是同一个模块，但名称不同吗？这是一个新模块吗？模块的数量永远不会改变？图像是在战争中还是存储在外部？CSS是在战争中还是存储在外部？等等请澄清您的问题以获得更好的帮助您想单击图像还是标题？标题和图标将保留在背景中

<ul>
  <li class="menu-1"><a href="#">Home</a></li>
  <s:iterator var="row" value="#session.PrivMenu.children" status="stat">
    <li class="menu-2"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>">
      <s:property value="#row.moduleName"/></a>
    </li>                       
  </s:iterator>
  <s:iterator var="row" value="#session.PrivMenu.children" status="stat">
    <li class="menu-3"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>">
      <s:property value="#row.moduleName"/></a>
    </li>                       
  </s:iterator>    
</ul>