Js-为元素CSS附加值

Question

这似乎很简单，但无法正常工作（未定义）。

我已将var设置为<ul> ，这是<div>元素“ feature_tabs_indicators”的子级。 pBoxShadowProperty函数获取当前浏览器支持的BoxShadow属性。

最后一条语句仅将pBoxShadowProperty设置为0，即它覆盖CSS设置的Box-Shadow属性。

有人可以在上一句话中解释我在做什么错吗？

最好，

var iActiveNo = 0;
var eTabInd = document.getElementById ("feature_tabs_indicators").children[0];
var pBoxShadowProperty = getSupportedCSSproperty(["boxShadow", "mozBoxShadow", "webkitBoxShadow"]);

function getSupportedCSSproperty (propertyArray)
{
    var root = document.documentElement;
    for (var i = 0; i < propertyArray.length; i++)
    {
        if (typeof root.style[propertyArray[i]] === "string")
        {
            return propertyArray[i];
        }
    }
}

iActiveNo = iActiveNo + 1;
eTabInd.children[iActiveNo - 1].style[pBoxShadowProperty] = "";

这是jsfiddle，按右上角的浅绿色按钮'rght'。

Answer 1

我想我知道您的问题是什么。 您在这里使用：

iActiveNo = iActiveNo + 1;

您发布的代码中尚未定义的内容。 但是您确实有：

var iActive = 0;

我认为实际上应该是：

var iActiveNo = 0;

否则，您的代码中将包含JS错误（无论如何，都会被发布）。

除此之外（也就是说，如果您打算从<ul>元素中取出第一个<li> <ul>元素并删除其box-shadow CSS属性）-您的代码就可以了。

编辑

杜德， 真是一团糟.. :)这是我修复的JSFiddle 。 以下是说明。

在解决真正的问题之前，应该先修复该JSFiddle中发生的几件事。

您在该小提琴中有错误-请参阅控制台。 该行：

var pBackgroundColorProperty = eStyle.backgroundColor //[pBoxShadowProperty];

不以分号结尾，然后由于下一行（..）（我认为）而被解释为一个函数-（至少对我而言）导致JS控制台错误。 如果添加分号-错误消失了。

另外...有一行：

console.log (eTabInd.children[iActiveNo-1].style.pBoxShadowProperty);

它会打印出您undefined ，这正是下面讨论的内容，应该是

console.log (eTabInd.children[iActiveNo-1].style[pBoxShadowProperty]);

然后打印空字符串。

此外，在打印时，您的pBoxShadowProperty变量包含boxShadow字符串。 当然，这不是我熟悉的有效CSS属性。 所以这：

eTabInd.children[iActiveNo - 1].style[pBoxShadowProperty] = "";

不会做任何事情。

现在到这里的问题的实质...

eTabInd.children[iActiveNo-1].style

首先没有'box-shadow'属性，因为您没有将其放在<li>元素的style属性中。 通过以下CSS选择器序列的优点将其放在<li>元素上： #feature_tabs_indicators ul #ind_bt 。

现在，由于需要style属性-您将无法获得计算出的样式，因此上述CSS选择器序列适用。 因此-您将无法删除它。

您可能要做的是创建另一个没有box-shadow属性的类，并用它替换原来的c_ind 。

Answer 2

好像您没有正确设置值，应该是

eTabInd.children[iActiveNo - 1].style.pBoxShadowProperty = "";

帮助或剂量仍返回0的剂量？