从自定义元素中删除is =""属性的预期行为是什么?

tru*_*ktr 4 html javascript web-component polymer custom-element

例如,

假设我们有<div is="awesomebutton"></div>一个自定义元素定义:

document.registerElement('awesomebutton', AwesomeButton)
Run Code Online (Sandbox Code Playgroud)

is=""删除属性或用新值替换属性时的预期行为是什么?

小智 7

根据最新工作草案规范(2016年2月26日)的第7节,它应该对元素的类型没有影响:

在实例化自定义元素之后,更改is属性的值不得影响此元素的自定义元素类型.

但是attributeChangedCallback仍然应该正常触发.(规范不会免除该is属性的触发.)您可以在支持的浏览器(Chrome或dom.webcomponents.enabled设置了配置标志的Firefox)中观察此行为:

'use strict';

const prototype = Object.create(HTMLElement.prototype);
prototype.attributeChangedCallback = function(name, oldValue, newValue) {
  this.textContent = `my "${name}" attribute changed to "${newValue}"!`; 
};

document.registerElement('examp-el', {prototype: prototype, extends: 'div'});

const el = document.createElement('div', 'examp-el');
el.textContent = "I'm an element!";

document.body.appendChild(el);
el.setAttribute('is', "changed once");
el.removeAttribute('is');
el.setAttribute('is', "changed twice");
el.setAttribute('is', "changed thrice");
Run Code Online (Sandbox Code Playgroud)

该规范尚未标准化,很快将发生重大变化,但我不希望这种行为发生变化.最新版编辑草案(截至2016年3月17日)第2.3节仍然指明了它:

创建自定义元素后,更改is属性的值不会更改元素的行为.