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

关于className属性的问题

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>控制类名（className属性）</title>
</head>
<style style = "text/css">
body{
     font-size:20px;
     color:red;
     /*background-color:#666;*/
     }
.one{
     width:200px;
     background-color:#666;
     }
.two{
     font-size:12px;
     color:#F00;
     }     
</style>

<body>
<p id = "con" class = "one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<form>
<input type ="button" onclick ="modifyclass()" value ="点击更改属性" >
<input type ="button" onclick ="modify1()" value ="点击显示更改后的属性" >
</form>
<script type ="text/javascript">
var myclass = document.getElementById("con");
document.write("P元素的Class值为："+myclass.className+"<br>");
function modifyclass(){
	myclass.className = "two";
}
function modify1(){
	document.write("改变后P元素的Class值是："+myclassName);
}

</script>
</body>
</html>

我的问题是：想显示更改后P元素的className属性的值，为什么点击“显示更改后的属性”按钮时没有反应呢？

shaoxiao64017599

2017-02-28

源自：JavaScript入门篇 3-6

关注问题我要回答

1211

操作

收起

4 回答

学习js 回答被采纳 +3 积分
2017-02-28

<script type ="text/javascript">
var myclass = document.getElementById("con");
function modifyclass(){
    myclass.className = "two";
    document.write("P元素的Class值为："+myclass.className+"<br>");
}

function modify1(){
    myclass.className = "two";
    document.write("改变后P元素的Class值是："+myclass.className);
}
</script>

1 回复有任何疑惑可以回复我~

收起回答

shaoxiao64017599 提问者

明白了两个函数

2017-02-28 回复有任何疑惑可以回复我~

半夏半暖半晴天
2017-02-28

function modify1(){

myclass.className = "two";

document.write("改变后P元素的Class值是："+myclass.className);

}

1 回复有任何疑惑可以回复我~

收起回答

shaoxiao64017599 提问者

恩恩明白了谢谢啦

2017-02-28 回复有任何疑惑可以回复我~

Samuel_Yang
2017-02-28

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>控制类名（className属性）</title>
</head>
<style style = "text/css">
body{
font-size:20px;
color:red;
/*background-color:#666;*/
}
.one{
width:200px;
background-color:#666;
}
.two{
font-size:12px;
color:#F00;
}
</style>

<body>
<p id = "con" class = "one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<form>
<input type ="button" onclick ="modifyclass()" value ="点击更改属性" >
<input type ="button" onclick ="modify1()" value ="点击显示更改后的属性" >
</form>
<script type ="text/javascript">
var myclass = document.getElementById("con");
function modifyclass(){
myclass.className = "two";
}
function modify1(){
myclass.className="one";
}

</script>
</body>
</html>