I have been learning about web components and I have the following code:
<input is="totally-not-checkbox">
<script>
var protoInput = Object.create(HTMLInputElement.prototype);
protoInput.createdCallback = function() {
this.style.color = "orange";
};
var nCB = document.registerElement("totally-not-checkbox", {
prototype: protoInput,
extends: 'input'
});
</script>
It is a simple implementation of "extended custom element", now I try to do the same but instead of using an INPUT I use a BUTTON:
<button is='MY-button'>hola</button>
<script>
var Proto = Object.create(HTMLButtonElement.prototype);
Proto.createdCallBack = function() {
this.style.color = "orange";
}
var tmp = document.registerElement('MY-button', {
prototype: Proto,
extends: 'button'
});
</script>
But with the BUTTON the extension is not done correctly; Consequently the BUTTON does not take the indicated properties.
what am I doing wrong?
Aucun commentaire:
Enregistrer un commentaire