HTML-KOMPONENTEN Teil 5

Die ANYDAY-Komponente ist in Tag, HTC definiert. Diese Komponente ist eine Kapselung der Kalendereinheit. Der Name der Komponente wird durch den in der ersten Zeile definierten XML-Namespace bestimmt.

af8b09d53169814d6ea4623d5b34ab46

Genau wie bei canlenar.htc gibt es nur eine Namespace-Definition. Der Grund dafür ist, dass es nicht erforderlich ist, andere HTCs auf dieser Seite aufzurufen. Das heißt, das HCT ist ein benutzerdefiniertes Label Wir definieren hier auch sein Verhalten. Tatsächlich ist die Definition einer HTML-Komponente die Definition eines benutzerdefinierten Tag-Verhaltens, das ein Attribut und ein Ereignis enthält:

<PUBLIC:COMPONENT tagName="DAY"> 
<PROPERTY NAME="value"></PROPERTY> 
<ATTACH EVENT="oncontentready" ONEVENT="fnInit()"<>/ATTACH> 
</PUBLIC:COMPONENT>

Beachten Sie das Ereignis oncontentready Wenn der Aufrufer „calendar.htc“ zum Importieren von „day.htc“ auffordert und vollständig importiert wird, wird dieses Ereignis generiert. Der Handler des Ereignisses ist „fnInit()“. fnInit() demonstriert viele wichtige HTC-Kapitel. Die erste Zeile weist element.value dem innerHTML der aufrufenden Seite zu Eigentum. HTML-Komponenten werden immer in Elementobjekten gekapselt. Das Wertattribut wird im Allgemeinen im PROPERTY-Tag definiert. Zur Erinnerung: Der tatsächliche Wert wird von der aufrufenden Seite, canlendar.htc, übergeben:

text += '04a9424aea79d7e9b86559d6a25ece7c68ff40c1a4cfb4439ed76ebf0fb45b127710ec56a4b2af8032401628a11805db02316988d1129bf85d55319dd82c6742'

function fnInit() { 
document.body.innerHTML = element.value; 
document.body.className = "clsDay"; 
defaults.viewLink = document; 
element.appointments = ""; 
element.date = element.value; 
}

Der Zellstil wird in der zweiten Zeile angegeben:

document.body.className = "clsDay"; clsDay-Definition An anderer Stelle auf dieser Seite:





Beachten Sie, dass das Datum im Kalender hellgelb ausgefüllt ist, was beweist, dass der angegebene Modus des HTC-Formats von seinem Aufrufer dominiert wird, nämlich: Kalender. HTC.

Die dritte Zeile von fninit() legt das viewLink-Attribut des Standardobjekts fest. Es kann ein HTC-Dokument (day.htc) für eine andere HTML-Komponente (calendar.htc) sichtbar machen ). Hier sind die Einstellungen für viewLink:

<STYLE> 
.clsDay { 
width:50; 
height:50; 
background-color:lightyellow; 
align:center; 
text-align:right; 
} 
</STYLE>

defaults.viewLink = document;

Beachten Sie, dass Sie das gesamte Dokumentobjekt verbinden müssen. Die letzten beiden Zeilen von fnInit() initialisieren zwei interne Eigenschaften, die wir später erklären werden:

element.appointments = "";
element.date = element.value;

wird für die eigene Anzeige verwendet. Die DAY-HTML-Komponente bezieht sich auf Mausklicks:

c202bab475885e36209b21834e00cfc9

Wenn der Tag angeklickt wird, wird der Benutzer daran erinnert, seine Termine für diesen Tag hinzuzufügen oder einen vorhandenen Termin zu ändern:


Der Eingabemechanismus hier ist sehr primitiv und die Benutzer Fügen Sie den Terminspezifikationen neue Zeilenbeschriftungen (82c2f54f4cf245029ffb326befd49b3f) hinzu, andernfalls werden sie alle in einer Zeile angezeigt. Schließlich sind innerHTML die Datumsdaten (element.date) und die Terminbezeichnung (element.appointments). von Verbindungsgliedern.
HEUTE Die HTML-Komponente (today.htc) ist der ANYDAY-Komponente (day.htc) sehr ähnlich. Der einzige Unterschied besteht darin, dass die Hintergrundfarbe im Stylesheet rosa statt hellgelb und die Schriftfarbe blau statt rot ist.

Beachten Sie, dass das aktuelle Datum im Kalender rosa mit blauem Text ist.

function fnShowAppts() { 
newAppointments = prompt("Add your 
appointment:", element.appointments); 
if (newAppointments != null) 
element.appointments = newAppointments; 
document.body.innerHTML = &#39;<FONT 
COLOR="red">&#39; + element.date + &#39;</FONT>&#39; + "<BR>" + &#39;<FONT 
SIZE="1">&#39; + element.appointments + &#39;</FONT>&#39;; 
}

Das Obige ist der fünfte Inhalt von HTML COMPONENTS. Weitere verwandte Artikel finden Sie auf der chinesischen PHP-Website (www.php.cn).