Modify custom item prototype

Question

If I create a custom item as follows

document.register('bar-foo', { prototype: { .... } }); // or document.registerElement

Now, after that, I would like to add something to the prototype of this element.

For example, I can do this with a div element:

HTMLDivElement.prototype.bar = function() {};
document.createElement('div').bar();

How do I do this with my custom bar-foo element?

Answer 1

I implemented custom elements in Chrome, so I am familiar with this. (FWIW has document.registerbeen renamed document.registerElement.)

To add something to the prototype of the user element later, you will first need a reference to the prototype object.

DIV, HTMLDivElement.prototype. . Custom Element registerElement. , :

BarFoo = document.registerElement('bar-foo', ...);

// later
BarFoo.prototype.foo = ...

( , spec new BarFoo().)

(), , , HTMLDivElement, .

, , . , . , . , .

, . , . , , Object.getPrototypeOf(elem) elem.__proto__ .

!

Answer 2

register registerElement, JavaScript, , , :

var saveMe = {};
document.register('bar-foo', saveMe);
saveMe.prototype = {
    // ...
}

Answer 3

, , platform.js, , api registerElement.

var prototype = Object.create(HTMLElement.prototype);
prototype.createdCallback = function() {
  ...
};
prototype.mycall = function() {
  console.log(this.shadowRoot.innerHTML);
};
document.registerElement('my-type', { prototype: prototype });

:

<my-type>100</my-type>
<script>
  document.getElementById('foo').mycall();
</script>

:

1) https://api.dartlang.org/apidocs/channels/be/dartdoc-viewer/dart-dom-html.HtmlDocument#id_registerElement registerElement . Platform.js . , (, ).

2) platform.js 0.4.0, registerElement, . IE10.