<button id="left">開燈</button>
<button id="right">關燈</button>

<script>
  //1.獲取頁面元素
  var left=document.getElementById('left');
  var right=document.getElementById('right');
  //注意獲取body的方式有兩種
  //第一種:直接使用document的點語法
  //var body1=document.body;
  // console.log ( body1 )
  //第二種:通過標簽名來獲取,但要注意去標簽名后要添加下標,因為用標簽名獲取的是數組
  var body=document.getElementsByTagName('body')[0]//因為通過標簽名獲取的是數組,一定要求取下標才可以
  console.log ( body )
  //2.注冊事件
  left.onclick=function ( ) {
    body.style.backgroundColor="white";
  }
  right.onclick=function ( ) {
   body.style.backgroundColor = "black";
  }
</script>

<script>
$ ( function () {
 //獲取按鈕們
 var buttons=$('button');
 //2.開燈
 $ (buttons[ 0 ]).click(function () {
   $('body').css("backgroundColor",'white');
 })
 // $ ( 'body' ).css('backgroundColor','white')
 //3.關燈
 buttons[ 1 ].onclick=function ( ) {
   $('body').css('backgroundColor','black');
 }
} )
</script>