使用動態屬性鍵獲取javascript對象的屬性值

我目前正在研究一個有很多SVG動畫的項目。當用戶滾動到SVG時，需要觸發這些動畫。使用動態屬性鍵獲取javascript對象的屬性值

我決定爲每個Snap.SVG動畫製作功能，並將它們存儲在使用SVG的ID作爲像這樣的關鍵對象的數組：

//Example Object 

var item = { 
    aboutUsSVG: function(){ 
     //aboutUsSVG animation code to go here 
    } 
}

我創建了一個Codepen的到目前爲止我的代碼在這裏：

http://codepen.io/decodedcreative/pen/mEpZbx

我設法創造微小物體的陣列。我有第二個功能，當SVG在屏幕上播放動畫。我無法使用動態鍵訪問存儲在數組中的動畫功能。

如果我知道的SVG的像這樣的名字我可以訪問功能：

var playAnimation = animations.animationsArray[0].ourCompanies; 

playAnimation();

但我希望編寫可用於網站上的所有動畫的解決方案，從而希望查詢的DOM對於SVG ID，然後查找相應的動畫。

所以：

var animationID = $(this).find(".svg-animation svg").attr('id'); 
var playAnimation = svgAnimations.animationsArray[0].animationID; 
playAnimation();

但在上述animationID代碼被逐字而不是使用由所述關於我們函數代替。

我認爲這是一個相當常見的JS問題。誰能幫忙？

來源

2016-07-14 James Howell

您正在尋找'[]'運算符。 – Pointy

'object [animationID]'把變量放在方括號內，而不是點符號。 – bloodyKnuckles

你上面的「數組」被稱爲item，我沒有看到你在下面的任何地方引用'item'。這導致我懷疑這是否是一個命名問題。 – Dellirium

要使用需要使用括號符號的可變訪問數組的一個屬性：

var animationID = $(this).find(".svg-animation svg").prop('id'); 
svgAnimations.animationsArray[0][animationID]();

來源

2016-07-14 11:43:41

可以使用括號記號具有動態可變

檢查訪問下面的代碼對象屬性

var animationID = $(this).find(".svg-animation svg").attr('id'); 
var playAnimation = svgAnimations.animationsArray[0][animationID]; 
playAnimation();

來源

2016-07-14 11:44:04 Arif

我絕對嘗試過這一點，但當時似乎沒有工作。但另一種嘗試已證明是成功的。多謝你們 –

使用動態屬性鍵獲取javascript對象的屬性值

回答

相關問題