控制类名如何让按钮循环效果？-慕课网

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

控制类名如何让按钮循环效果？

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

炙宠啸逗逗

2014-11-18 22:15

现在点击按钮，可以添加.two样式？如果想再点击一次按钮，恢复.one样式。循环往复，不知道该添加什么语句？？

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

function modify(){

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

p2.className="two"; }

</script>

写回答关注

3回答

Cbove

2014-12-12 10:09:27

if("one"==p2.className)
{
p2.className="two";

}else{p2.className="one";}

0 0
墨迹玖久

2014-11-26 11:24:15

本人菜鸟，弱弱的写个想法function add(){
var p1 = document.getElementById("p1");
if(p1.className=="one"){
p1.className="two";
}else{
p1.className="one";
}
}

0 0

偌颜宁: 2014-11-19 10:17:43

你可以参考下，自己用其他的方式写写试试

<body>
    <p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="更改外观" onclick="modify()"/>
    <input type="hidden" value="1" id="txt_hidden"/>
<script>       
    function modify(){
        var p2 = document.getElementById("p2");
        var txtHidden = document.getElementById("txt_hidden");
        if(txtHidden.value==1){
            p2.className="two"; 
            txtHidden.value =2;
        }else{
           p2.className="one"; 
            txtHidden.value =1; 
        }
    }
</script>

1 2

小东别院

老师你好，这个是不是先实行 1 再实行2 呀；

2014-12-01 22:40:45

共 1 条回复 >

JavaScript入门篇

JavaScript做为一名Web工程师的必备技术，本教程让您快速入门

739817 学习 · 9566 问题

查看课程

相似问题

如何制作新按钮

回答 1