我如何改变我的班级 <li> 使用JavaScript

Question

我的项目是一个asp.net，它的母版页包含一个列表

<ul id="navigation">
         <li id="li1" runat="server" class="selected"><a href="Events.aspx">Events</a></li>
         <li id="li2" runat="server"><a href="AddEvent.aspx">Add Event</a></li>
         <li id="li3" runat="server"><a href="MyProfile.aspx">Profile</a></li>
         <li id="li4" runat="server"><a href="Friends.aspx">Friends</a></li>
         <li id="li5" runat="server"><a href="FindFriends.aspx">Find Friends</a></li>
         <li id="li6" runat="server"><a href="Schedual.aspx">Schedual</a></li>
         <li>
             <asp:LinkButton ID="LogOutButton" runat="server" OnClick="LogOutButton_Click">Log Out</asp:LinkButton>
         </li>
</ul>

所选类（css类）具有一张图片，该图片告诉用户他在哪一页上。 导航时如何使用javascript或C＃更改此类？

我对javascript没有很好的经验

Answer 1

document.getElementById("li6").className = "whatever";

应该管用/

Answer 2

$("#li1").addClass("selected");

将工作。

例

Answer 3

这在JavaScript / jQuery中非常简单。

但是，如果这是为了导航，则意味着在显示新页面时需要对其进行更新，我将在服务器的标记中进行此操作。

您没有对如何服务此页面说太多。 但是ASP.NET WebForms和MVC都允许您以多种不同的方式控制所提供的HTML。

Answer 4

您可以为所有li标签类设置如下所示：

<li class="li">
 ... content of the tag
</li>

在您的JavaScript中，您可以将其他类添加到“ li”类的所有元素中：

$(".li").addClass("classYouWantToAdd");

并在css文件中：

.li
{
  ... needed css for the class
}

Answer 5

这是另一篇文章，告诉您如何通过类名获取元素

通过类名选择一个div