javascript - 为什么 .getPropertyValue() 不会为“borderRadius”属性返回值？

Question

这是功能：

function lastmenuborder() {
    var articleparent = document.getElementById('article').parentNode;
    var articlestyle = window.getComputedStyle(articleparent,null).getPropertyValue('borderRadius');
    alert (articlestyle);
}

我没有得到任何价值，但父节点的 css 是：

div#mainbody div.placeholder {
    border-radius: 3px;
}

我必须改变什么才能返回“3px”？非常感谢所有帮助；我仍然是 JavaScript 的新手。

Answer 1

对于getPropertyValue()，您使用连字符而不是 camelCase。

这适用于 Chrome...

.getPropertyValue('border-radius');

但是 Firefox 似乎需要使用这种语法的特定角落......

.getPropertyValue('border-top-left-radius');

Answer 2

getComputedStyle在下面的 IE8 上不受支持，以修复此使用：

if (!window.getComputedStyle) {
       window.getComputedStyle = function(el, pseudo) {
           this.el = el;
               this.getPropertyValue = function(prop) {
               var re = /(\-([a-z]){1})/g;
               if (prop == 'float') prop = 'styleFloat';
               if (re.test(prop)) {
                   prop = prop.replace(re, function () {
                       return arguments[2].toUpperCase();
                   });
               }
               return el.currentStyle[prop] ? el.currentStyle[prop] : null;
           }
           return this;
       }
   }

var elem = window.getComputedStyle(document.getElementById('test'), "");
alert(elem.getPropertyValue("borderRadius"));