                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript入门篇

怎么样能让“点击更改”后“p元素class值为：one”变为two？

<!DOCTYPE html>

<html>

<head>

<title>className属性</title>

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>

</form>

var mychar=document.getElementById("con");

document.write("P元素Class值为："+mychar.className+"<br>");

function modifyclass(){

mychar.className="two";

}

</script>

</body>

</html>

大块吃肉188

2016-07-26

源自：JavaScript入门篇 3-6

关注问题我要回答

793

操作

收起

4 回答

q_Amily 回答被采纳 +3 积分
2016-07-29

<!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>
这是我仿照你之前提的问题，别人给出答案的方式写的，虽然能实现你说的效果，但我觉得代码有点冗余