一个按钮实现2个功能

Question

想实现一个功能，页面点击显示按钮的时候 显示数据 ，同时按钮名字变成隐藏；点击隐藏的时候 隐藏数据；

Answer 1

document.getElementById("buttonId").addEventListener("click",function(){
    if(document.getElementById("divId").style.display!="block"){
        this.innerHTML="隐藏";
        document.getElementById("divId").style.display="block";
    }else{
        this.innerHTML="显示";
        document.getElementById("divId").style.display="none";            
    }
},false);

Answer 2

给按钮加一个值，比如 1 和 0

1为显示数据 0 为隐藏数据

每次点击按钮获取这个值，判断是 1 或 0 操作DOM并修改这个值
我用了jquery

<button value='1' onclick="f(this.value)">显示</button>
<p>内容</p>
<script type="text/javascript">
  function f(val){
    if (val=='1') {
      $('button').text('隐藏');
      $('p').css('display','none');
      $('button').attr('value','0');
    }else{
      $('button').text('显示');
      $('p').css('display','block');
      $('button').attr('value','1');
    }
  }
</script>

Answer 3

$("a").toggle(function(){
    $(this).text("隐藏")；
    $(target).show();
},function(){
    $(this).text("显示")；
    $(target).hide();
});