Question

如果我有这样的事情：

function foo(class){
    for(i=0; i<(class.length);i++){
       return document.getElementsByClassName(class)[i];
    }
}

现在我想做这样的事情：

 foo("someclass").innerHTML="something";

它只会对第一个元素执行此操作并且我理解为什么会发生这种情况以及如何使其正常工作，但是如何让函数获取其他方法而不在循环中告诉它究竟该做什么，比如< / p>

   foo("someclass").innerHTML="something";//this to put something inside the element
   foo("someclass").style.backgroundColor="#000");// and this to work also

所以，如果它可能的话，如何在不将这些方法放入foo函数循环的情况下使函数执行此操作？有没有办法将这些方法放在像这样的变量

中

  function foo(class).variableMethod{
for(i=0; i<(class.length);i++){
   document.getElementsByClassName(class)[i].variableMethod;
}

}

这可能吗？

Answer 1

您可以将函数传递给foo()，并让foo()为每个匹配的元素调用该函数：

function foo(className, func)
{
    var elements = document.getElementsByClassName(className);
    for (var i = 0; i < elements.length; ++i) {
        func(elements[i]);
    }
}

现在您可以执行以下操作：

foo("someclass", function(element) {
    element.innerHTML = "something";
    element.style.backgroundColor = "#000";
});

Answer 2

在这里添加其他很棒的答案，你可以做的一件事是创建名为innerHtml的覆盖方法。然后，您可以使用innerHtml检查集合以及单个实例，并根据需要进行操作。

<强>更新

以下是方法链的快速示例。在这里，我基本上获取了基于标签名称的元素集合，并使用我使用Javascript prototype对象创建的val（）方法设置它们的值。

function Foo(tagName)
{
    this.collection = document.getElementsByTagName(tagName);
    return this;
}

Foo.prototype.val= function(value){

   for(var i = 0; i < this.collection.length; i++)
   {
       this.collection[i].innerHTML = value;
   }
}


var x = new Foo("li").val("Hello World");

您可以在此处查看此工作演示：http://jsfiddle.net/E48ym/1/

Answer 3

Frédéric Hamidi's answer会做你想要的，但你也可以使用像jQuery这样的框架 - 这就是它的设计目的。所以你可以这样做：

$('.className').text('something');

将所有元素的文本设置为className到某事，或

$('.className').css('background-color', '#000');

使用className类更改所有元素的背景颜色。

如何使类接受方法而不事先指定方法？

3 个答案: