上一篇文章中我們的代碼最后是寫成了下圖這樣的：

其實(shí)，我們還可以再簡(jiǎn)化。
這就需要用到---變量。
我來(lái)舉個(gè)例子，讓你更好的理解什么叫做變量。
有一個(gè)人，他的名字叫巴勃羅.迭戈.荷瑟.山迪亞哥.弗朗西斯科.德.保拉.居安.尼波莫切諾.克瑞斯皮尼亞諾.德.羅斯.瑞米迪歐斯.西波瑞亞諾.德.拉.山迪西瑪.特立尼達(dá).瑪利亞.帕里西奧.克里托.瑞茲.布拉斯科.畢加索。 為了方便，大家在叫他的時(shí)候就直接簡(jiǎn)稱“畢加索”。

這一長(zhǎng)串的名字可以用“畢加索”三個(gè)字代替，那這三個(gè)字我們就可以看做是這一長(zhǎng)串的名字的變量。

JavaScript中我們是用var來(lái)對(duì)變量進(jìn)行定義的。
那上面這個(gè)例子就可以理解成
var 畢加索=巴勃羅.迭戈.荷瑟.山迪亞哥.弗朗西斯科.德.保拉.居安.尼波莫切諾.克瑞斯皮尼亞諾.德.羅斯.瑞米迪歐斯.西波瑞亞諾.德.拉.山迪西瑪.特立尼達(dá).瑪利亞.帕里西奧.克里托.瑞茲.布拉斯科.畢加索

那么

巴勃羅.迭戈.荷瑟.山迪亞哥.弗朗西斯科.德.保拉.居安.尼波莫切諾.克瑞斯皮尼亞諾.德.羅斯.瑞米迪歐斯.西波瑞亞諾.德.拉.山迪西瑪.特立尼達(dá).瑪利亞.帕里西奧.克里托.瑞茲.布拉斯科.畢加索畫了一幅畫=畢加索畫了一幅畫

所以上一篇最后的那段代碼我們可以簡(jiǎn)寫成這個(gè)樣子：

function toGreen()
{   
  var oDiv=document.getElementById('div1');   
  oDiv.style.width='300px';
  oDiv.style.height='300px';
  oDiv.style.background='green';
}

這里面

var oDiv=document.getElementById('div1');

變量oDiv這幾個(gè)字母直接就可以替代document.getElementById('div1')這一大長(zhǎng)串。

if 語(yǔ)句

if(預(yù)報(bào)有雨){
  帶傘
}
else{
  不帶傘
}

圖上這個(gè)功能：一個(gè)按鈕，如果它隱藏了一部分，那點(diǎn)擊按鈕后，它就顯示出來(lái)；如果他顯示出來(lái)了，那點(diǎn)擊按鈕，它就隱藏起來(lái)。

其中script中代碼

<script>
    function showHide()
    {
      var oDiv=document.getElementById('div1');

        if(oDiv.style.display=='block')
          {
            oDiv.style.display='none';
          }
          else
          {
            oDiv.style.display='block';
          }
     }
  </script>

只要理解了if語(yǔ)句，利用之前學(xué)到的東西就可以把這個(gè)功能做出來(lái)。上面出現(xiàn)了一個(gè)新的符號(hào)，==(雙等號(hào))。在JS里=代表賦值（改變），而雙等號(hào)則更接近于數(shù)學(xué)中的等號(hào)，其作用是判斷兩邊是否相等。在本例中，oDiv.style.display=='block'即代表對(duì)display的值是否為block進(jìn)行判斷，如果成立則代表div1是顯示的狀態(tài)，執(zhí)行if語(yǔ)句將其隱藏；反之不成立則代表div1是隱藏狀態(tài)，執(zhí)行else語(yǔ)句將其顯示。