注意在日歷中日期的被填色為亮黃色,這證明HTC的格式的指定模式被它的調用者所支配,即:calendar.htc.
fninit()的第三行設置default對象的viewlink屬性,vIEwLink屬性是HTML組件的基礎,它可以使得一個HTC文檔(day.htc)對另一個Html組件(calendar.htc)來說可見.這兒就是vIEwLink的設置:
defaults.vIEwLink = document;
注意您需要聯接的是整個document對象。fnInit()的最後兩行初始化我們將在以後解釋的兩個內部屬性:
element.appointments = "";
element.date = element.value;
用於它本身的顯示,DAY Html組件和鼠標點擊相關:
<BODY onclick="fnShowAPPTs()">
當該天被點擊,用戶被提醒在該天加上他或她的約會,或者修改已經存在的約會:
function fnShowAPPTs() {
newAppointments = prompt("Add your appointment:", element.appointments);
if (newAppointments != null) element.appointments = newAppointments;
document.body.innerHtml = '<FONT COLOR="red">' + element.date + '</FONT>' + "<BR>" + '<FONT SIZE="1">' + element.appointments + '</FONT>';
}
這裡的輸入機制非常原始,用戶在約會指定中加入新行標簽(<BR>),否則他們將都顯示在一行。最後innerHtml是日期數據(element.date)和約會指定(element.appointments) 的連接紐帶。
TODAY Html組件(today.htc)和ANYDAY組件(day.htc)非常類似。唯一的不同是樣式快中的background-color是pink而不是lightyellow,並且字體顏色是blue 而不是red.
注意在日歷中當前日期是粉紅色(pink)背景藍色的字。
下節將列出我們所講的日歷的完整代碼和一個不用HTC組件方法實現的日歷代碼