Javascript动态函数调用

我想在Javascript中做一些Rubyish。我正在编写一个包装设置DOM元素样式。这将大大像（在每个风格的基础上）：Javascript动态函数调用

ele.style.backgroundColor = someSetting 
ele.style.padding = anotherSetting

我今天准备这样做（我会使用Ruby语法来说明）是：

class Element 
    def initialize(ele) 
    @ele = ele 
    end 

    def setDOMElementStyle(styleSettings = {}) 
    styleSettings.each_pair do |styleAttribute, setting| 
     @element.style.send(styleAttribute, setting) 
    end 

    # Other wrapper stuff for elements here 
end 

element = Element.new document.createElement("div") 
element.setDOMElementStyle :width => '60px', :height => '2px', :top => '0px', :left => '0px'

在Javascript中，我可以用可怕的eval做到这一点，但我想知道是否有一个更好的方式来处理它。这是对邪恶eval的破解。

var Element, element; 

Element = function() { 
    function Element(element) { 
    this.element = element; 
    } 
    Element.prototype.setDOMElementStyle = function(styleSettings) { 
    var setting, styleAttribute; 

    if (styleSettings == null) { 
     styleSettings = {}; 
    } 
    for (setting in styleSettings) { 
     styleAttribute = styleSettings[setting]; 
     eval("@element.style." + styleAttribute + " = " + setting); 
    } 
    } 
} 

element = new Element(document.createElement("div")); 
element.setDOMElementStyle({ 
    width: '60px', 
    height: '2px', 
    top: '0px', 
    left: '0px' 
});

谢谢！

来源

2011-10-07 Steve Ross

我不知道为什么你需要''eval'，你可以使用jQuery和['.css（）']（http://api.jquery.com/css/）？或'.style [attr] = val'？ –

你已经使用'[]'来访问'styleSettings [setting]'... – zzzzBov

@DaveNewton用于教育目的的伪代码。使用技巧不是学习语言的正确方法。 –

使用方括号：

element.style[styleAttribute] = setting

在JavaScript中，每个属性也可以通过方括号提及。例如：

window.location.href === window["location"].href === window["location"]["href"] 
    === window.location["href"]

来源

2011-10-07 20:44:59

加快了30秒的+1 +1 –

[尴尬的笑容]我记得一些DOM对象只是作为普通的可索引对象访问。令人高兴的是，事实证明我错了。谢谢！ –

Javascript动态函数调用

回答

相关问题