網站設計 ANYDAY組件定義在day,htc中，該組件是日曆單元的一個封裝。組件的名字是由定義在第一行的XML命名空間決定的。
正如canlenar.htc一樣，你只有一個命名空間定義，原因是在該頁不用調用其他的HTC，也就是說該HCT是葉子HTC，在這裡我們定義的自定義標籤是DAY，同樣我們也定義它的行為，實際上，HTML組件的定義就是自定義標籤行為的定義，該行為包括一個屬性和一個事件：
/ATTACH>
注意事件 oncontentready ，當它的調用者calendar.htc要求導入day.htc並且被完全導入，該事件就會產生，事件的處理者是fnInit().我們來看看它：
function fnInit() {
document.body.innerHTML = element.value;
document.body.className = "clsDay";
defaults.viewLink = document;
element.appointments = "";
element.date = element.value;
}
fnInit()演示了很多重要的HTC章節。第一行把 element.value 指定給調用頁的 innerHTML 屬性。HTML組件總是封裝在element對像裡。value屬性一般定義在PROPERTY標籤中，作為提醒，實際的值從調用頁面傳入，canlendar.htc:
text += ' |
| '
單元樣式在第二行指定：
document.body.className = "clsDay";
樣式類 clsDay 定義在該頁的別處：
注意在日曆中日期的被填色為亮黃色，這證明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組件和鼠標點擊相關：
當該天被點擊，用戶被提醒在該天加上他或她的約會，或者修改已經存在的約會：
function fnShowAppts() {
newAppointments = prompt("Add your appointment:", element.appointments);
if (newAppointments != null) element.appointments = newAppointments;
document.body.innerHTML = '' + element.date + '' + "
" + '' + element.appointments + '';
}
這裡的輸入機制非常原始，用戶在約會指定中加入新行標籤(
)，否則他們將都顯示在一行。最後innerHTML是日期數據(element.date)和約會指定(element.appointments) 的連接紐帶。
TODAY HTML組件(today.htc)和ANYDAY組件(day.htc)非常類似。唯一的不同是樣式快中的background-color是pink而不是lightyellow,並且字體顏色是blue 而不是red.
注意在日曆中當前日期是粉紅色(pink)背景藍色的字。
下節將列出我們所講的日曆的完整代碼和一個不用HTC組件方法實現的日曆代碼
網頁寄存
没有评论:
发表评论