La creación de un componente de secuencia de comandos de comportamiento es parecida a la creación de cualquier otro tipo de componente de secuencia de comandos, con la diferencia de que se vinculan los eventos de Microsoft® Internet Explorer a la secuencia de comandos que ejecuta para responder a dichos eventos.
Este tema se divide en las secciones siguientes:
Los componentes de secuencia de comandos de comportamiento incluyen un elemento <implements> que identifica el controlador de interfaz de comportamiento. Dentro del elemento <implements> se utilizan:
Los componentes de secuencia de comandos de comportamiento también pueden incluir propiedades y métodos personalizados que amplíen los ya disponibles para el elemento del documento contenedor. Para obtener información, consulte Exponer propiedades y métodos en componentes de secuencias de comandos de comportamiento.
El ejemplo siguiente muestra un componente de secuencia de comandos de comportamiento que cambia el color de un elemento de la página contenedora cada vez que se pasa el mouse (ratón) sobre el elemento. Para ello, el ejemplo enlaza los eventos onmouseover y onmouseout de DHTML a funciones del componente de secuencia de comandos que configuran el atributo de estilo DHTML del elemento. El ejemplo también configura el color de vínculo del documento cuando éste se inicializa mediante un enlace al evento onload del objeto window de DHTML.
Además de enlazar eventos a la secuencia de comandos, el componente de secuencia de comandos también inserta texto en cualquier elemento <H1> del documento contenedor que esté vinculado a este componente de secuencia de comandos. Finalmente, lo expone y activa un evento denominado onchange, que amplía el objeto de evento del objeto window de DHTML con una propiedad personalizada denominada newvalue.
Nota Es necesario incluir una sección CDATA para hacer opaca la secuencia de comandos del elemento <script>. Para obtener información, consulte Archivos de componentes de secuencia de comandos y compatibilidad XML.
<?XML version="1.0"?>
<component>
<implements type="Behavior"
>
<comment> Las instrucciones siguientes hacen que se llame a
las funciones do_nmousedown y do_mouseout
cuando el mouse pasa sobre el elemento del
documento contenedor.</comment>
<attach event="onmouseover" handler="do_onmouseover"/>
<attach event="onmouseout" handler="do_onmouseout"/>
<comment>Esta instrucción llama a la función de inicialización
cuando se active el evento window.</comment>
<attach for="window" event="onload" handler="docinit"/>
<comment>Las instrucciones siguientes definen el texto HTML
que aparecerá en el documento contenedor.</comment>
<layout>
<h1>Éste es el texto HTML que se mostrará en el elemento</h1>
</layout>
<comment>La instrucción siguiente define un evento personalizado
que activa el método fireEvent desde el componente de secuencia de comandos.</comment>
<public>
<event name="onchange"/>
<public>
</implements>
<script language="JScript">
<![CDATA[
var normalColor, normalSpacing;
function do_onmouseover(){
// Guardar valores originales.
normalColor = style.color;
normalSpacing= style.letterSpacing;
style.color = "red";
style.letterSpacing = 2;
oEvent = createEventObject();
oEvent.newcolor = "red";
fireEvent("onchange",oEvent);
}
function do_onmouseout(){
// Restaurar valores originales.
style.color = normalColor;
style.letterSpacing = normalSpacing;
}
function docinit(){
document.linkColor = "red";
}
]]>
</script>
</component>
Del código anterior se puede destacar lo siguiente:
Nota La secuencia de comandos incluida se ejecuta incluso antes de que el componente de secuencia de comandos de comportamiento se aplique al elemento, lo cual limita las instrucciones que se pueden ejecutar en la secuencia de comandos incluida. Por ejemplo, si el mismo componente de secuencia de comandos de comportamiento del ejemplo expusiera una propiedad denominada hiliteColor, la secuencia de comandos incluida podría hacer referencia a hiliteColor directamente; es decir, utiliza el espacio de nombres del componente de secuencia de comandos. Sin embargo, no está permitido hacer referencia a hiliteColor como de comportamiento.elemento.hiliteColor desde una secuencia de comandos incluida, porque, en ese punto, el componente de secuencia de comandos de comportamiento todavía no se ha aplicado al elemento. Para obtener más información, consulte Reglas de ámbito y Consideraciones de tiempo más adelante en este tema.
Se han realizado las mejoras siguientes al modelo de objetos DHTML para Microsoft® Internet Explorer 5 a fin de agregar compatibilidad para componentes de secuencia de comandos de comportamiento.
En DHTML, el objeto event de DHTML proporciona información acerca del evento. Aunque en DHTML el objeto event está accesible a controladores de evento a través del objeto window de DHTML, en un componente de secuencia de comandos de comportamiento el objeto event se pasa como un parámetro al controlador de evento.
El código siguiente de un hipotético componente de secuencia de comandos de calculadora muestra cómo enlazar los eventos del teclado y del mouse a una función de componente de secuencia de comandos denominada doCalc. La función doCalc utiliza el objeto event para obtener información acerca de las condiciones en las que se activó el evento.
Nota Es necesario incluir una sección CDATA para hacer opaca la secuencia de comandos del elemento <script>. Para obtener información, consulte Archivos de componentes de secuencia de comandos y compatibilidad XML.
<implements type="Behavior"> <attach event="onclick" handler="doCalc"/> <attach event="onkeydown" handler="doCalc"/> </implements> <script language="jscript"> <![CDATA[ function doCalc(oEventParam){ oElement = oEventParam.srcElement; if(oEventParam.type == "keydown"){ sVal = KeyCodeToChar(oEventParam.keyCode); } else{ if (oEventParam.srcElement.type != "button"){ return;} sVal = stripBlanks(oEventParam.srcElement.value); } } // incluya aquí otras secuencias de comandos ]]> </script>
Al trabajar con componentes de secuencia de comandos, en realidad se trabaja con tres espacios de nombres: el comportamiento, el elemento y el documento contenedor. Las reglas de ámbito definen el orden en el que se resuelven los conflictos de nombres en un componente de secuencia de comandos de comportamiento. Los nombres se resuelven en el siguiente orden:
El nombre se resuelve con el definido por el comportamiento en cualquier parte del componente de secuencia de comandos, tanto si es una variable, una propiedad definida por el comportamiento, un método o un evento.
Si el nombre no se resuelve con éxito, se resuelve con una propiedad, método o evento que se aplique al elemento.
Finalmente, el nombre se resuelve con el nombre de una propiedad, método o evento que se aplique al objeto window de la página contenedora.
En el ejemplo siguiente, observe cómo se han resuelto los nombres mediante las reglas de ámbito definidas anteriormente:
<implements type="Behavior"
>
<attach event="onmouseover" handler="do_onmouseover"/>
<attach event="onmouseout "handler="do_onmouseout"/>
</implements>
<script language="JScript">
<![CDATA[
var normalColor, normalSpacing;
function event_onmouseover()
{
// Guardar valores originales.
normalColor = style.color;
normalSpacing = style.letterSpacing;
style.color = "red";
style.letterSpacing = 2;
}
function event_onmouseout()
{
// Restaurar valores originales.
style.color = normalColor;
style.letterSpacing = normalSpacing;
}
]]>
</script>
Al crear componentes de secuencia de comandos de comportamiento, es importante saber cuándo se aplica el componente de secuencia de comandos de comportamiento al elemento. Hasta que no se haya aplicado, las secuencias de comandos no tienen acceso a los valores de las propiedades definidas por el comportamiento que se puedan establecer en el documento.
Debido a que el componente de secuencia de comandos de comportamiento está encapsulado en un archivo independiente del documento HTML, se descarga independientemente del resto del documento. A medida que el documento y el componente de secuencia de comandos de comportamiento se analizan y cargan, éste recibe notificaciones del proceso a través de la función especificada con el método attachNotification. Actualmente, se notifica al componente de secuencia de comandos de comportamiento con una notificación "contentChange" o "documentReady". La notificación "contentChange" se envía cuando el contenido del elemento al que se ha adjuntado el componente de secuencia de comandos de comportamiento se ha analizado y, posteriormente, siempre que cambie el contenido del elemento. La notificación "documentReady" se envía cuando el documento se ha descargado y analizado.
Debido a que la secuencia de comandos incluida en el archivo del componente de secuencia de comandos se ejecuta tan pronto como se realiza una instancia del componente de secuencia de comandos de comportamiento, es posible que los valores de los atributos y las propiedades definidas por el comportamiento que se establecen en el documento no estén accesibles desde una secuencia de comandos incluida. Sin embargo, estas propiedades estarán disponibles tan pronto como se envíe la primera notificación "contentChange".
Exponer propiedades y métodos en componentes de secuencias de comandos de comportamiento | Exponer eventos personalizados en componentes de secuencia de comandos de comportamiento | Referencia del controlador de comportamiento
Ayuda de Javascript y Vbscript para Javascripts.astalaweb.com. |