为什么不能实现-慕课网

首页课程实战体系课手记专栏慕课教程

为什么不能实现

来源：3-6 控制类名（className 属性）

慕仔9503151

2019-03-30 17:11

<!DOCTYPE HTML>

<html>

<head>

<title>className属性</title>

<style>

body{ font-size:16px;}

.one{

border:1px solid #eee;

width:230px;

height:50px;

background:#ccc;

color:red;

}

.two{

border:1px solid #ccc;

width:230px;

height:50px;

background:#9CF;

color:blue;

}

</style>

</head>

<body>

<p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>

<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>

function add(){

var p1 = document.getElementById("p1");

}

function modify(){

var p2 = document.getElementById("p2");

}

</script>

</body>

</html>

写回答关注

4回答

gogod

2019-04-24 17:55:25

代码你都没有打上去，实现什么。。。点击当然什么东西都不发生

0 0
繫念笑眸

2019-04-09 20:22:06

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style>
    body{ font-size:16px;}
    .one{
       border:1px solid #eee;
       width:230px;
       height:50px;
       background:#ccc;
       color:red;
    }
   .two{
       border:1px solid #ccc;
       width:230px;
       height:50px;
       background:#9CF;
       color:blue;
   }
   </style>
</head>
<body>
    <p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="添加样式" onclick="add()"/>
   <p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="更改外观" onclick="modify()"/>

   <script type="text/javascript">
       function add(){
          var p1 = document.getElementById("p1");
          document.write("p元素的值为:"+p1.className);
       }
       function modify(){
          var p2 = document.getElementById("p2");
          document.write("p2元素值为:"+p2.className);
       }
   </script>

0 0
丿明明啊

2019-04-04 10:24:33

你代码都不完整，怎么去实现啊，33行跟37行你都补上去
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style>
body{ font-size:16px;}
.one{
border:1px solid #eee;
width:230px;
height:50px;
background:#ccc;
color:red;
}
.two{
border:1px solid #ccc;
width:230px;
height:50px;
background:#9CF;
color:blue;
}
</style>
</head>
<body>
<p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<input type="button" value="添加样式" onclick="add()"/>
<input type="button" value="清除样式" onclick="acc()"/>
<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<input type="button" value="更改外观" onclick="modify()"/>
<input type="button" value="清楚外观" onclick="modiyf()"/>

<script type="text/javascript">
function add(){
var p1 = document.getElementById("p1");
p1.className="one";
}
function acc(){
var p1 = document.getElementById("p1");
p1.className="tow";
}
function modify(){
var p2 = document.getElementById("p2");
p2.className="tow";
}
function modiyf(){
var p2 = document.getElementById("p2");
p2.className="one";
}
</script>
</body>
</html>

0 1
qq_慕函数3177880

2019-03-30 19:50:03

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style>
body{ font-size:16px;}
.one{
border:1px solid #eee;
width:230px;
height:50px;
background:#ccc;
color:red;
}
.two{
border:1px solid #ccc;
width:230px;
height:50px;
background:#9CF;
color:blue;
}
</style>
</head>
<body>
<p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<input type="button" value="添加样式" onclick="add()"/>
<p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<input type="button" value="更改外观" onclick="modify()"/>

<script type="text/javascript">
function add(){
var p1 = document.getElementById("p1");
p1.className = "one" ;
}
function modify(){
var p2 = document.getElementById("p2");
p2.className = "two" ;
}
</script>
</body>
</html>

0 1