如何解决如何修改原型上的吸气剂/吸气剂?
对于原型上的函数,我曾经做过类似的事情:
var attachShadow = HTMLElement.prototype.attachShadow
HTMLElement.prototype.attachShadow = function (option) {
var sh = attachShadow.call(this,option)
console.log('ShadowDOM Attached!')
return sh
}
在此示例中,我修改了attachShadow
原型内的HTMLElement
方法,以便在将新的shadowDOM
附加到元素时通知我。
现在我想与ShadowRoot.prototype.adoptedStyleSheets
做类似的事情,但是这次adoptedStyleSheets
是一个吸气剂/设置者,var adoptedStyleSheets = HTMLElement.prototype.adoptedStyleSheets
会导致错误:Uncaught TypeError: Illegal invocation
。
我不确定该怎么做,如何修改原型上的吸气剂/吸气剂?
解决方法
您不想检索adoptedStyleSheets
内部的值(显然,从原型调用时会抛出错误),而是要检索其属性描述符以便在您自己的adoptedStyleSheets
中重用:
(function () {
const oldAdoptedStyleSheetsGetter = Object.getOwnPropertyDescriptor(ShadowRoot.prototype,'adoptedStyleSheets');
Object.defineProperty(ShadowRoot.prototype,"adoptedStyleSheets",{
get: function () {
console.log('adoptedStyleSheets was accessed!');
return oldAdoptedStyleSheetsGetter.get.call(this)
},});
})();
customElements.define('web-component',class extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: 'open' });
this.shadowRoot.innerHTML = `Hi I'm a web component`;
console.log('this.shadowRoot.adoptedStyleSheets:',this.shadowRoot.adoptedStyleSheets);
}
});
<web-component></web-component>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。