怎么样能让“点击更改”后“p元素class值为：one”变为two？
大块吃肉188
2016-07-26 10:50
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<title>className属性</title>
<style type="text/css">
input{
font-size: 10px;
}
.one{
width:200px;
background-color: #CCC;
}
.two{
font-size: 18px;
color:#F00;
}
</style>
</head>
<body>
<p id="con" class="one">JavaScript</p>
<form>
<input type="button" name="button" onclick="modifyclass()" value="点击更改" />
</form>
<script type="text/javascript">
var mychar=document.getElementById("con");
document.write("P元素Class值为："+mychar.className+"<br>");
function modifyclass(){
mychar.className="two";
}
</script>
</body>
</html>
4回答
-
- q_Amily
- 2016-07-29 23:50:41
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html" charset="utf-8"> <title>className属性</title> <style type="text/css"> input{ font-size: 10px; } .one{ width:200px; background-color: #CCC; } .two{ font-size: 18px; color:#F00; } </style> </head> <body> <p id="con" class="one">JavaScript</p> <p id="aa"></p> <form> <input type="button" name="button" onclick="modifyclass()" value="点击更改" /> </form> <script type="text/javascript"> var mychar=document.getElementById("con"); var aa=document.getElementById("aa"); aa.innerHTML=("P元素Class值为："+mychar.className+"<br>"); function modifyclass(){ mychar.className="two"; aa.innerHTML=("P元素Class值为："+mychar.className+"<br>"); } </script> </body> </html> 这是我仿照你之前提的问题，别人给出答案的方式写的，虽然能实现你说的效果，但我觉得代码有点冗余 -
- 慕粉3791347
- 2016-08-06 15:57:37
调用document.write就是重新打开一个文档。本来你的这个页面已经加载完毕，然后你在执行一个document.write重新打开一个文档然后输出，所以你原来的内容就会被覆盖了
-
- 慕粉3791347
- 2016-08-06 15:53:06
已经改变了啊？先到浏览器执行看看是不是没调用我直接复制你的代码执行没错的
-
- 大块吃肉188
- 2016-07-26 10:51:35
我试着把document.write("P元素Class值为："+mychar.className+"<br>");这句放到function modifyclass(){ ｝但是这样会覆盖上边的内容
JavaScript入门篇
739817 学习 · 9566 问题
相似问题