Hello，程序員那些事又與大家見面了！

JS簡易日歷

先給大家看一下效果：

大家可能會覺得，唉~好像跟上節課講的選項卡差不多，就是十二個按鈕，改變this的class，同時下面放十二個div，每次顯示其中一個，這樣想沒錯，但是大家想想，我們這個是做年歷，只有十二個月，要是我們做萬年歷呢？那就很麻煩了，所以我們換一種方式來做。

我們先來檢查一下元素：

其實這里面顯示的只有一個div

真正在變的只是里面的文字

下面我們就來看一下，怎么改變里面的文字(這就要用到我們上節課提到的innerHTML)

首先還是看布局：

實際上布局并不復雜,就是一系列的?li?，并且有一個的?class?是?active，大家結合我們上節課講的一看就知道是怎么回事，下面還有一個?div?，這個?div?就是我們來放置這些文字的。

我們先把上面這十二個月的東西做了：

跟選項卡一樣，先把所有的 class 都去掉，然后只給 this 加一個‘active’的 class ，這樣上半部分就完成了，當然下面的文字還是沒有變的。

其實改變下面的也很簡單，就是給下面的 div 設置 innerHTML ：

首先就是設置幾月份的活動，不可能每個月都是一月，但是有一個問題，我們怎么知道但前的 li 是第幾個月的呢？

我們可以給所有的 li 都編個號，也就是在循環中加一個 index 的屬性：

然后把1改為 this 的編號，說到這里不得不提到字符串的連接了：

字符串連接

把要連接的字符串放在單引號里面，用加號連接起來：

數字不用加單引號：

但是有一點要注意一下：

這樣寫大家覺得會彈出什么呢？

“abc17def”嗎？實際上并不是：

這其實與數學中的加減法類似，它有優先級的區分，前面的字符串先與12進行了字符串加法，然后“abc12”這個字符串再跟5相加，最后出來就是上面顯示的咯~

那么如果我們想要輸出“abc17def”該怎么寫呢：跟數學一樣，直接加一個括號就可以咯~

好，咱們回到剛剛的問題，用字符串連接來實現月份的改變：

因為剛剛的循環中是從零開始的，而月份是從一開始的，所以我們這里要加一：

現在月份就可以正常改變了，下面的文字怎么改變呢？

用最笨的辦法當然就是用 if ，判斷不同的月份出現不同的文字，但是這樣太麻煩了。我們可以用JS里的數組來完成：

數組：

數組里面也可以放字符串，所以我們就用數組來改變文字：

簡易日歷到這里就講完了，相信大家也學到了很多，我們下期再見！

官方QQ認證空間：2256167997

郵箱：qyxmtzx@163.com

官方新浪微博@中北大學大數據學院

主編：?阮臻

責編：?姜鑫源

本期編輯：實習編輯?韓康澤?魏孟梁

總結

以上是生活随笔為你收集整理的如何在程序中不用加号实现加法_程序员那些事 | JavaScript基础（六）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。