提问人：MOHAMED SIKKANDAR AFZAL M 提问时间：3/13/2023 最后编辑：KeithMOHAMED SIKKANDAR AFZAL M 更新时间：3/13/2023 访问量：87
为什么删除属性 API 不适用于“is”属性？
why remove attribute API not working for "is" attribute alone?
问：
var div = document.createElement("div");
var html = "<div id='issue' is='if'> some content </div>";
div.innerHTML = html;
document.body.appendChild(div);
var newDiv = document.querySelector("#issue");
newDiv.removeAttribute("id");
console.log(newDiv.outerHTML);
newDiv.removeAttribute("is");
console.log(newDiv.getAttribute("is"))
console.log(newDiv.outerHTML);“is”属性在 dom 中被删除，但在执行 outerHTML 或 innerHTML 时不会删除它。我知道“is”是 Web 组件的特殊属性，但即使在删除属性后也没有意义，它不会在 outerHTML 中被删除。
答：
2赞
Alohci
3/13/2023
#1
从 HTML 生活标准：
创建自定义元素后，更改 is 属性的值不会更改元素的行为，因为它将作为其 is 值保存在元素上。
因此，“removeAttribute（）”删除了 is 属性，但不删除 is 值。
然后 outerHTML 遵循序列化规则：
由于 is 属性在创建自定义内置元素的信号中具有特殊作用，因为它为解析的 HTML 提供了一种设置元素的 is 值的机制，因此我们在序列化期间对其进行了特殊处理。这可确保通过序列化-分析往返来保留元素的 is 值。
为了确保序列化-分析往返仍然有效，序列化过程显式地将元素的 is 值写出为 is 属性：
因此，outerHTML 序列化从 is 值中写出 is 属性。
评论
0赞
MOHAMED SIKKANDAR AFZAL M
3/14/2023
感谢您的澄清。我们有什么方法可以得到元素的“是”值吗？
0赞
Alohci
3/14/2023
@MOHAMEDSIKKANDARAFZALM - 我看不出直接的方法。但显然你可以使用 outerHTML 来获取它。例如：console.log(Object.assign(document.createElement('template'), { innerHTML: newDiv.cloneNode().outerHTML }).content.firstChild.getAttribute("is"));
评论