这(至少在目前)纯粹是实验,但我很好奇:有没有办法将方法(通过原型(prototype)设计)附加到元素集合?我测试了以下代码:
<div>a</div>
<div>b</div>
<div>c</div>
<script>
NodeList.prototype._ = function(s)
{
for (x = 0; x < this.length; x++)
{
eval('this[x]' + '.' + s);
}
return this;
}
document.getElementsByTagName('div')._("style.backgroundColor = 'red'")._('innerHTML += x');
</script>
目前,它在 Opera 中运行得很好;正如预期的那样,在所有 div 元素上调用 _ 方法,然后将传递给它的字符串依次 eval() 到每个元素上。请注意,_ 方法允许链接,并且这也已被演示,调用 _ 将预测的 x 迭代器变量附加到每个元素的innerHTML。
现在有两个问题...
首先,有没有更好的方法来解决这个问题?我一直希望能够做到 document.getElementsByTagName('div').style.backgroundColor = "red";
,但可惜的是,它还没有实现。这就是我首先这样做的原因,也是我如此简洁地命名该方法的原因;我正在尝试尽可能地模仿它。
其次,假设这是一个合理的用法,我将如何让它在 Firefox 中工作?该浏览器相当于 NodeList
的是 HTMLCollection
,但尝试对后者进行原型(prototype)设计根本不会成功。有建议吗?
最佳答案
我已经制定了我认为可以作为可行解决方案的方案;使用此方法链式修改元素集合有什么根本性的坏处吗?
<script>
_ = function()
{
for (x = 0; x < arguments[0].length; x++)
{
for (y = 0; y < arguments[1].length; y++)
{
eval('arguments[0][x]' + '.' + arguments[1][y]);
}
}
}
</script>
用法:
divs = document.getElementsByTagName('div');
_(divs, ["style.color = 'red'", "innerHTML += x"]);
关于javascript - 将链式方法附加到 JavaScript 中的元素集合,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/603870/