今天帶來乙個純js+css手寫的日曆,
一開始先顯示當前日期,比如下方25日就是當前日期會有較深藍色背景色,滑鼠指著的日期是下方14日的淡藍色背景色
上面顯示日期,可左右選擇上個月或者下個月
<
!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
"x-ua-compatible" content=
"ie=edge"
>
日曆外掛程式<
/title>
.main
table
th,td
.title
.title img
#now
.title .control
.title .control:hover
.nowday
.allday:hover
<
/style>
<
/head>
="main"
>
="title"
>
="control" onclick=
"left()"
>
"../assets/向左.png" alt=
"">
<
/div>
"now"
>
<
/div>
="control" onclick=
"right()"
>
"../assets/向右.png" alt=
"">
<
/div>
<
/div>
1>
一<
/th>
二<
/th>
三<
/th>
四<
/th>
五<
/th>
六<
/th>
日<
/th>
<
/tr>
<
/thead>
="con"
>
<
/tbody>
<
/table>
<
/div>
var con = document.
getelementsbyclassname
("con"
)let date =
newdate()
var showyear = date.
getfullyear()
//展示在頁面上的年份
var showmonth = date.
getmonth()
+1//展示在頁面上的月份
setcalender
(date.
getfullyear()
,date.
getmonth()
)function
setcalender
(year,month)年$
月` var daycount =
newdate
(year,month+1,
0).getdate()
//獲取這個月一共有幾天
let firstweek = date.
getday()
==0?7
: date.
getday()
// 獲取這個月的第一天是星期幾
let list=
newarray()
let yindex =
0// 第幾行
let index =
1//日期
while
(index<=daycount)
else}}
else
} yindex++
}for
(let i in list)
` }
else
` }
td += list[i]
[j]}
tr.innerhtml=td
con[0]
.(tr)}}
//上個月
function
left()
else
}//下個月
function
right()
else
}<
/script>
<
/body>
<
/html>這個日曆實現了基本功能,至於樣式可進行個人所需進行調整。
js手寫日曆外掛程式
doctype html html lang en head meta charset utf 8 meta name viewport content width device width,initial scale 1.0 title 日曆 title style table td,th sty...
純js css實現loading等待效果
此外掛程式是基於jqueryui的widget,下面是具體實現 第一部分css loading loading box.loading box loading message.sideslip.scroll box 第二部分jquery function undefined message 任務載入...
純手寫ArrayList集合 二
在閱讀arraylist的jdk原始碼的時候,你經常會看到這兩個系統函式 arrays.copyof elementdata,size 而這個方法的原始碼是 public static t copyof t original,int newlength public static t copyof ...