HTML组件(HTML COMPONENTS)之五-tutorial css-php.cn

Rumah

tutorial css

HTML组件(HTML COMPONENTS)之五

Dec 17, 2016 pm 01:52 PM

　ANYDAY组件定义在day,htc中，该组件是日历单元的一个封装。组件的名字是由定义在第一行的xml命名空间决定的。

<HTML XMLNS:ANYDAY>

　　正如canlenar.htc一样，你只有一个命名空间定义，原因是在该页不用调用其他的HTC，也就是说该HCT是叶子HTC，在这里我们定义的自定义标签是DAY，同样我们也定义它的行为，实际上，HTML组件的定义就是自定义标签行为的定义，该行为包括一个属性和一个事件：

&lt;PUBLIC:COMPONENT tagName=&quot;DAY&quot;&gt; 
&lt;PROPERTY NAME=&quot;value&quot;&gt;&lt;/PROPERTY&gt; 
&lt;ATTACH EVENT=&quot;oncontentready&quot; ONEVENT=&quot;fnInit()&quot;&lt;&gt;/ATTACH&gt; 
&lt;/PUBLIC:COMPONENT&gt;

Salin selepas log masuk

注意事件 oncontentready ，当它的调用者calendar.htc要求导入day.htc并且被完全导入，该事件就会产生，事件的处理者是fnInit().我们来看看它：

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

Salin selepas log masuk

　fnInit()演示了很多重要的HTC章节。第一行把 element.value 指定给调用页的 innerHTML 属性。HTML组件总是封装在element对象里。value属性一般定义在PROPERTY标签中，作为提醒，实际的值从调用页面传入，canlendar.htc:
text += '<TD><ANYDAY:DAY value=' + dayOfMonth + '></ANYDAY:DAY></TD>'
单元样式在第二行指定：

document.body.className = "clsDay";
样式类 clsDay 定义在该页的别处：

&lt;STYLE&gt; 
.clsDay { 
width:50; 
height:50; 
background-color:lightyellow; 
align:center; 
text-align:right; 
} 
&lt;/STYLE&gt;

Salin selepas log masuk

　　注意在日历中日期的被填色为亮黄色，这证明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(&quot;Add your 
appointment:&quot;, element.appointments); 
if (newAppointments != null) 
element.appointments = newAppointments; 
document.body.innerHTML = &#39;&lt;FONT 
COLOR=&quot;red&quot;&gt;&#39; + element.date + &#39;&lt;/FONT&gt;&#39; + &quot;&lt;BR&gt;&quot; + &#39;&lt;FONT 
SIZE=&quot;1&quot;&gt;&#39; + element.appointments + &#39;&lt;/FONT&gt;&#39;; 
}

Salin selepas log masuk

这里的输入机制非常原始，用户在约会指定中加入新行标签(<BR>)，否则他们将都显示在一行。最后innerHTML是日期数据(element.date)和约会指定(element.appointments) 的连接纽带。
　　TODAY HTML组件(today.htc)和ANYDAY组件(day.htc)非常类似。唯一的不同是样式快中的background-color是pink而不是lightyellow,并且字体颜色是blue 而不是red.
　　注意在日历中当前日期是粉红色(pink)背景蓝色的字。

以上就是HTML组件(HTML COMPONENTS)之五的内容，更多相关文章请关注PHP中文网（www.php.cn）！

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn