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的劑量？