以下表达式的计算结果均为TRUE:
'z-index' in getComputedStyle(document.body) // true
Reflect.has(getComputedStyle(document.body), 'z-index') // true
事实上,下面的求值结果也为True,这表明‘z-index’是相应CSSStyleClaimation对象的own属性的名称:
getComputedStyle(document.body).hasOwnProperty('z-index') // true
Object.hasOwn(getComputedStyle(document.body), 'z-index') // true
但是,this的计算结果为False
Reflect.ownKeys(getComputedStyle(document.body)).includes('z-index') // false
怎么可能Object.hasOwn(x, y)
的判断结果为真,而Reflect.ownKeys(x).includes(y)
的判断结果为假呢?这没有任何意义.
还要注意的是,这种情况并不是因为getComputedStyle(Document.Body)是一个只读的、经过计算的CSSStyleClaimation对象.从HTMLElement的Style属性检索到的CSSStyleClaimation对象不是只读的,但同样的情况也会发生:
Object.hasOwn(document.body.style, 'z-index') // true
Reflect.ownKeys(document.body.style).includes('z-index') // false
MDN称(https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle)
可以使用getPropertyValue(PropName)API或通过直接索引对象(如obj[‘z-index’]或obj.zIndex)来访问css属性值.
我理解允许访问obj['z-index']
的值的convenience.我想知道的是,在给定ECMASSCRIPT语言的规则的情况下,Object.has Own(x,y)和Reflect.ownKeys(X).Includes(Y)之间产生的真值差异是如何可能的.
编辑:我发现了另一个堆栈溢出问题,它提出了完全相同的问题(how does it work element.style["background-color"]),但没有得到明确的答案.