关于window.getComputedStyle的解释以及Chrome以不同方式处理它的原因

mau*_*ruz 5 javascript dom google-chrome web-standards

由于Chrome Stable登陆版本33.0.1750.117,因此window.getComputedStyle的逻辑已从其他浏览器更改.下面的代码小提琴:http://jsfiddle.net/HD4bD/17/

任何人都可以解释变化的内容以及对此的"正确"裁决是什么?

鉴于以下内容:

HTML

<body>
    <div class="normal"></div>
    <div class="display-none"></div>
    <div class="visibility-hidden"></div>
</body>
Run Code Online (Sandbox Code Playgroud)

CSS

.normal:before {
    content: "NORMAL: "
}

.display-none:before {
    content: "DISPLAY-NONE: ";
    display: none;
}

.visibility-hidden:before {
    content: "VIS-HIDDEN: "
    visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)

JS

var $ = document.querySelector.bind(document),
    pass = "This text should have 1 or more labels before it",
    fail = "The label is missing.  Something's wrong.",
    normalContent = getB4Content('.normal'),
    dNoneContent = getB4Content('.display-none'),
    vHideContent = getB4Content('.visibility-hidden');

function getB4Content(selector){
     return window.getComputedStyle($(selector),':before').getPropertyValue('content');
}



$('.normal').innerHTML = normalContent === '' ? fail : normalContent + pass;

$('.display-none').innerHTML = dNoneContent === '' ? fail : dNoneContent + pass;

$('.visibility-hidden').innerHTML = vHideContent === '' ? fail : vHideContent + pass;
Run Code Online (Sandbox Code Playgroud)

OUTPUT

Firefox v27:
NORMAL:"NORMAL:"此文本在它之前应该有一个或多个标签
"DISPLAY-NONE:"此文本在它之前应该有一个或多个标签
none此文本之前应该有一个或多个标签

IE 11 NORMAL:"NORMAL:"此文本在它之前应该有一个或多个标签
"DISPLAY-NONE:"此文本在它之前应该有一个或多个标签
none此文本之前应该有一个或多个标签

Chrome v33
NORMAL:"NORMAL:"此文本前面应该有一个或多个标签
缺少标签.出了点问题.
标签丢失了.出了点问题.

Poi*_*nty 2

看来这是一个报告的 Chromium bug