如何以编程方式更改div的样式
时间:2020-03-06 14:29:28 来源:igfitidea点击:
如何更改div的样式(颜色),如下所示?
"<div id=foo class="ed" style="display: <%= ((foo.isTrue) ? string.Empty : "none") %>"> <%= ((foo.isTrue) ? foo.Name: "false foo") %>"`
解决方案
如果代码是服务器端的,那么该代码片段并没有说太多,为什么不更改例如HTML元素的类在那里?
看起来我们正在编写ASP或者JSP。我不太熟悉这两种语言,但是无论我们使用哪种语言,原则都相同。
如果我们使用的颜色数量有限,那么通常的选择是创建许多类并在样式表中为它们编写规则集:
.important { background: red; } .todo { background: blue; }
等等。
然后让服务器端脚本生成HTML以使CSS匹配:
<div class="important">
当然,我们应该确保可以通过颜色以外的其他方式获得信息。
如果颜色是在运行时确定的,则可以生成样式属性:
<div style="background-color: red;">
我们应该在CSS中设置颜色,然后以编程方式更改CSS类。例如:
(CSS)
div.Error { color:red; }
(ASP.NET/VB)
<div class='<%=Iif(HasError, "Error", "")%>'> .... </div>
通常,我们可以直接进行操作
document.getElementById(" myDiv")。style.color =" red";
这里有参考。
如果要使用浏览器中运行的客户端代码(javascript)更改div的颜色,请执行以下操作:
<script> var fooElement = document.getElementById("foo"); fooElement.style.color = "red"; //to change the font color </script>
试试这个:
在.aspx文件中,将thees行
<div id="myDiv" runat="server"> Some text </div>
那么你可以使用例如
myDiv.Style["color"] = "red";
如果要直接更改类而不是样式:
即..用我们想要的样式创建另一个类...
myDiv.Attributes["class"] = "otherClassName"