C# - 如何更改 HTML 元素属性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/186918/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
C# - How to change HTML elements attributes
提问by Vince Panuccio
My master page contains a list as shown here. What I'd like to do though, is add the "class=active" attribute to the list li thats currently active but I have no idea how to do this. I know that the code goes in the aspx page's page_load event, but no idea how to access the li I need to add the attribute. Please enlighten me. Many thanks.
我的母版页包含一个列表，如下所示。不过，我想做的是将“class=active”属性添加到当前处于活动状态的列表 li 中，但我不知道如何执行此操作。我知道代码在 aspx 页面的 page_load 事件中，但不知道如何访问我需要添加属性的 li。请赐教。非常感谢。
<div id="menu">
<ul id="nav">
<li class="forcePadding"><img src="css/site-style-images/menu_corner_right.jpg" /></li>
<li id="screenshots"><a href="screenshots.aspx" title="Screenshots">Screenshots</a></li>
<li id="future"><a href="future.aspx" title="Future">Future</a></li>
<li id="news"><a href="news.aspx" title="News">News</a></li>
<li id="download"><a href="download.aspx" title="Download">Download</a></li>
<li id="home"><a href="index.aspx" title="Home">Home</a></li>
<li class="forcePadding"><img src="css/site-style-images/menu_corner_left.jpg" /></li>
</ul>
</div>
采纳答案by Ben Scheirman
In order to access these controls from the server-side, you need to make them runat="server"
为了从服务器端访问这些控件，您需要使它们 runat="server"
<ul id="nav" runat="server">
<li class="forcePadding"><img src="css/site-style-images/menu_corner_right.jpg" /></li>
<li id="screenshots"><a href="screenshots.aspx" title="Screenshots">Screenshots</a></li>
<li id="future"><a href="future.aspx" title="Future">Future</a></li>
<li id="news"><a href="news.aspx" title="News">News</a></li>
<li id="download"><a href="download.aspx" title="Download">Download</a></li>
<li id="home"><a href="index.aspx" title="Home">Home</a></li>
<li class="forcePadding"><img src="css/site-style-images/menu_corner_left.jpg" /></li>
</ul>
in the code-behind:
在代码隐藏中：
foreach(Control ctrl in nav.controls)
{
if(!ctrl is HtmlAnchor)
{
string url = ((HtmlAnchor)ctrl).Href;
if(url == GetCurrentPage()) // <-- you'd need to write that
ctrl.Parent.Attributes.Add("class", "active");
}
}
回答by Adam Naylor
If they were runat=server you could use the attributes property.
如果它们是 runat=server，您可以使用 attributes 属性。
回答by Lou Franco
You could register a client script like this:
您可以像这样注册一个客户端脚本：
(set id to the id of the li that you want to set to active)
（将 id 设置为要设置为 active 的 li 的 id）
ClientScript.RegisterStartupScript(this.GetType(), "setActiveLI", "document.getElementById(\""+id+"\").setAttribute(\"class\", \"active\");", true);
This generates a JavaScript call on the page near the bottom after elements have already been rendered.
在元素已经呈现之后，这会在靠近底部的页面上生成一个 JavaScript 调用。
回答by Adam Naylor
In order to find that particular control it will need to be defined as public (in the generated designer)
为了找到该特定控件，需要将其定义为 public（在生成的设计器中）
Or will need to be wrapped by a public get in the codebehind.
或者需要通过代码隐藏中的公共获取来包装。
回答by Adam Naylor
You can expose the li's on the master page to any content pages by wrapping them in properties on the master page:
您可以通过将母版页上的 li 包装在母版页上的属性中，将母版页上的 li 公开给任何内容页：
public GenericHtmlControl Li1
{
get
{
return this.LiWhatever;
}
}
Then on the content page:
然后在内容页面上：
MasterPage2 asd = ((MasterPage2)Page.Master).Li1.Attributes.Add("class", "bla");
If i've got that right!
如果我猜对了！
回答by Rob
The code below can be used to find a named control anywhere within the control hierarchy:
下面的代码可用于在控件层次结构中的任何位置查找命名控件：
public static Control FindControlRecursive(Control rootControl, string id)
{
if (rootControl != null)
{
if (rootControl.ID == id)
{
return rootControl;
}
for (int i = 0; i < rootControl.Controls.Count; i++)
{
Control child;
if ((child = FindControlRecursive(rootControl.Controls[i], id)) != null)
{
return child;
}
}
}
return null;
}
So you could do something like:
所以你可以这样做：
Control foundControl= FindControlRecursive(Page.Master, "theIdOfTheControlYouWantToFind");
((HtmlControl)foundControl).Attributes.Add("class", "active");
Forgot to mention previously, that you do need runat="server" on any control you want to be able to find in this way =)
之前忘了提到，您确实需要 runat="server" 在您希望能够以这种方式找到的任何控件上=)
回答by csgero
All the parts have already been provided in previous answers, but to put the whole thing together, you'll need to:
之前的答案中已经提供了所有部分，但是要将整个内容放在一起，您需要：
<ul>and <li>elements
<ul>和<li>元素
Alternatively you could also add the code to the OnLoad(...) method of the master page, so you don't have to add the method call to the Page_Load on every page.
或者，您也可以将代码添加到母版页的 OnLoad(...) 方法，这样您就不必在每个页面上都将方法调用添加到 Page_Load。
回答by Vince Panuccio
I found a link that works using CSS and involves only changing the body tag's class attribute. This means there's no Javascript and there's no for loops or anything.
我找到了一个使用 CSS 的链接，并且只涉及更改 body 标签的 class 属性。这意味着没有 Javascript，也没有 for 循环或任何东西。
#navbar a:hover,
.articles #navbar #articles a,
.topics #navbar #topics a,
.about #navbar #about a,
.contact #navbar #contact a,
.contribute #navbar #contribute a,
.feed #navbar #feed a {
background: url(/pix/navbarlinkbg.gif) top left repeat-x; color: #555;
}
....
<body class="articles" onload="">
<ul id="navbar">
<li id="articles"><a href="/articles/" title="Articles">Articles</a></li>
<li id="topics"><a href="/topics/" title="Topics">Topics</a></li>
<li id="about"><a href="/about/" title="About">About</a></li>
<li id="contact"><a href="/contact/" title="Contact">Contact</a></li>
<li id="contribute"><a href="/contribute/" title="Contribute">Contribute</a></li>
<li id="feed"><a href="/feed/" title="Feed">Feed</a></li>
</ul>
Read more here http://www.websiteoptimization.com/speed/tweak/current/
在这里阅读更多 http://www.websiteoptimization.com/speed/tweak/current/
回答by Bevan
Add runat="server" on the li tags in the masterpage then add this to the appropriate page_load event to add the 'active' class to the li in the masterpage
在母版页的 li 标签上添加 runat="server" 然后将其添加到适当的 page_load 事件中以将 'active' 类添加到母版页中的 li
HtmlGenericControl li = HtmlGenericControl)Page.Master.FindControl("screenshots"); li.Attributes.Add("class", "active");
HtmlGenericControl li = HtmlGenericControl)Page.Master.FindControl("screenshots"); li.Attributes.Add("class", "active");
回答by Bevan
Try this the great example for future use. i know this thread is old, but for future queries...
试试这个很好的例子，以备将来使用。我知道这个线程很旧，但对于未来的查询......
