HTML コンポーネント パート 5

ANYDAYコンポーネントはday,htcで定義されています。このコンポーネントはカレンダーユニットのパッケージです。コンポーネントの名前は、最初の行で定義された XML 名前空間によって決まります。



canlenar.htc と同様に、名前空間の定義は 1 つだけです。その理由は、このページで他の HTC を呼び出す必要がないためです。つまり、ここで定義するカスタム ラベルは次のとおりです。 DAY の動作も定義します。実際、HTML コンポーネントの定義は、属性とイベントを含むカスタム タグの動作の定義です。

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

イベント 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の章。最初の行は、呼び出し元ページの innerHTML に element.value を割り当てます。 属性。 HTML コンポーネントは常に要素オブジェクトにカプセル化されます。 value 属性は通常、PROPERTY タグで定義されます。注意してください。実際の値は呼び出しページ canlendar.htc から渡されます。
テキスト += '04a9424aea79d7e9b86559d6a25ece7c48ab20ae2b5b12461f88f7ececa655227710ec56a4b2af8032401628a11805db02316988d1129bf85d55319dd82c6742'
セルのスタイルは 2 行目で指定されます:

document.body.className = "clsDay";
スタイル クラス clsDay はページの他の場所で定義されます。 :

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

カレンダー内の日付が明るい黄色で色付けされていることに注目してください。これは、HTC の形式固有のモードが呼び出し元、つまり、calendar.htc によって支配されていることを示しています。
fninit() の 3 行目は、デフォルト オブジェクトの viewlink 属性を設定します。viewLink 属性は、HTC ドキュメント (day.htc) を別の HTML コンポーネント (calendar.htc) から見えるようにすることができます。これが viewLink 設定です:

defaults.viewLink = document;

接続する必要があるのはドキュメントオブジェクト全体であることに注意してください。 fnInit() の最後の 2 行は、後で説明する 2 つの内部プロパティを初期化します。

element.appointments = ""; element.value;

は独自の表示に使用され、DAY HTML コンポーネントはマウスのクリックに関連します:

c202bab475885e36209b21834e00cfc9

その日をクリックすると、その日の予定を追加するか、既存の予定を変更するようにユーザーに通知されます。

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;; 
}

ここでの入力メカニズムは非常に原始的であり、ユーザーは新しい行タグ (<) を追加します。 ;BR>)、それ以外の場合は、すべて 1 行に表示されます。最後に innerHTML は日付データ (element.date) と予定の指定 (element.appointments) です。 接続リンクの。

今日 HTML コンポーネント (today.htc) は、ANYDAY コンポーネント (day.htc) に非常に似ています。唯一の違いは、スタイル シートの背景色が薄黄色ではなくピンクであり、フォントの色が赤ではなく青であることです。
カレンダーの現在の日付が青色の背景にピンク色で表示されていることに注目してください。

上記は HTML COMPONENTS の 5 番目のコンテンツです。その他の関連記事については、PHP 中国語 Web サイト (www.php.cn) に注目してください。