Js - 爲元素CSS附加值

這似乎很簡單，但它不工作（未定義）。Js - 爲元素CSS附加值

我已將變量設置爲<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] = "";

Here is the jsfiddle, press the light green button 'rght' on top right.

來源

2011-10-14 Kayote

你可能擴大什麼是不正確的工作？ – ZenMaster

剛纔已經粘貼的jsfiddle代碼@ZenMaster 爲了澄清，箱陰影財產不被動態設置。我用CSS設置了箱子陰影。當用戶按下綠色按鈕時，應刪除箱子陰影。 – Kayote

應該發生什麼？無論如何 - 你在那個小提琴中有錯誤 - 請參閱控制檯。該行：'var pBackgroundColorProperty = eStyle.backgroundColor // [pBoxShadowProperty];'不以分號結尾，然後在下一行（由於..）在下一行解釋爲函數（我認爲）。如果添加分號 - 一切似乎都在工作。 – ZenMaster

我想我想清楚你的問題是什麼。您在這裏使用：

iActiveNo = iActiveNo + 1;

東西還沒有在您的發佈代碼中定義。但是你有：

var iActive = 0;

我認爲應該實際上是：

var iActiveNo = 0;

，否則你的代碼中有JS錯誤（因爲它是貼了，反正）。

除此之外（也就是說，如果您打算從<ul>元素中取出第一個<li>元素並刪除其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。

來源

2011-10-14 04:44:06 ZenMaster

謝謝@ZenMaster。這是一個錯字，它在代碼中正確定義。我會將它上傳到jsfiddle併發布代碼。 – Kayote

正確答案在ZenMaster問題的迷你評論中。 – Kayote

@SalmanKhan恐怕不是全部，我的朋友。見上面的更新。 – ZenMaster

-1

它看起來像您沒有設置值正確，因爲它應該像

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

劑量幫助或劑量仍返回0？

來源

2011-10-14 04:22:52 david

'pBoxShadowProperty'是一個變量，因此應該通過[]來訪問 - 就像OP已經完成的一樣。你的方式行不通。 – ZenMaster

@ZenMaster真正它將只返回CSS屬性 – david

ZenMaster是正確的，它不會因爲風格是不是一個對象，其屬性（pBoxShadowProperty）被設定。 – Kayote

Js - 爲元素CSS附加值

回答

相關問題