如何将 webkit 样式分配给 Javascript 中的元素

Question

我正在尝试将 webkit 样式分配给一个元素，但无法让它工作。这是我需要分配的：

-webkit-box-shadow:inset 0px 0px 0px 10px #f00;
-moz-box-shadow:inset 0px 0px 0px 10px #f00;
box-shadow:inset 0px 0px 0px 10px #f00;

这是我试过的：

document.getElementById("EL").style.webkitBoxShadowInset = '0px 0px 0px 10px #f00';
document.getElementById("EL").style.mozBoxShadowInset = '0px 0px 0px 10px #f00';
document.getElementById("EL").style.boxShadowInset = '0px 0px 0px 10px #f00';

Answer 1

document.getElementById("EL").style.WebkitBoxShadow = 'inset 0px 0px 0px 10px #f00';
document.getElementById("EL").style.MozBoxShadow = 'inset 0px 0px 0px 10px #f00';
document.getElementById("EL").style.boxShadow = 'inset 0px 0px 0px 10px #f00';

注意 Webkit* 和 Moz* 的大写以及单词 inset 的位置

Answer 2

您可以优化结果：

var el = document.getElementById("EL"),
    bS = 'inset 0px 0px 0px 10px #f00';

el.style.WebkitBoxShadow = el.style.MozBoxShadow = el.style.boxShadow = bS;

如何将 webkit 样式分配给 Javascript 中的元素

How to assign webkit styles to an element in Javascript

javascript

webkit