Javascript 类的类似JQuery的编程快捷方式

我正在写一些javascript和HTML，由于我所写内容的性质，我受到启发编写了一些快捷功能。我常用

document.getElementById()

及

我经常通过这些方法访问样式属性，所以我用类似JQuery的样式编写了这个快捷方式函数：

var $=function(elemId){
    return(document.getElementById(elemId).style);
} 

假设我有一个id为“foo”的div，并希望将颜色更改为红色：

$('foo').color='red';

这为我节省了大量代码

document.getElementById('foo').style.color='red';

尤其是当我在脚本中使用这个50多次时

我对类做了类似的操作，但由于类的性质，我无法访问HTML对象的.style对象

document.getElementsByClassName()

因为它返回一个字符串。我通常要做的是将项目收集为一个数组，然后像这样迭代：

var x=document.getElementsByClassName('class');
for(i=0; i<x.length; i++){
x[i].style.color='red';
}

所以基本上我想要的是一个函数，它可以做我的ID函数所做的事情，但是需要一个类，而不需要遍历这个类

免责声明 我不想要的是一个涉及JQuery的答案。我无法使用它，这就是为什么我自己以这种方式编写代码的原因。请只回答常规JavaScript

---

如果你有任何问题，发表评论，我会尽力澄清。谢谢

不是以你的方式表述的。问题是，当您使用“=”时，无法将更改通知数组。甚至jQuery也不是这样做的

您可以执行以下操作：

css('class').set('color', 'red');

---

然后，您的函数只需迭代数组并设置每个元素的属性。

一个简单的解决方案是：

var css = function(classname, style) {
  var x = document.getElementsByClassName(classname);
  for(i = 0; i < x.length; i++){
    for(var s in style) {
      if(style.hasOwnProperty(s)) {
        x[i].style[s] = style[s];
      }
    }
  }
}

---

当然，属性应该匹配dom样式属性（“backgroundColor”而不是“backgroundColor”）。

不，没有办法避免for循环。

谢谢您的帮助。谢谢。不过，我会等着看是否有更多有用的答案。我肯定有。这是编程。总有一种方法。jQuery使用

.css（'key'，'value'）

是有原因的……仅供参考，您可以研究一下：John通过一个简单的方法创建类似于jQuery的函数实例，然后您可以将得到的答案函数添加到该函数的原型中。谢谢！这是超级接近我正在寻找的，这将工作。没有帮助。正如上面的答案所表明的，显然有一种方法。我已经测试过了，它是有效的。看起来你没有做你的研究。@莱西总是有一个迭代。比尔是“至少一次迭代”背景下的赖特。即使您可以看到@manji的答案，仍然会有一个循环运行在使用

document.getElementsByCassName（classname）获取的收集元素上@SudhansuChoudhary是的，但我指的是函数之外的迭代。对不起，我不清楚。嘿@莱西，你不需要这样很酷。。我明白了你想问的问题，但通常情况下，这种情况会发生在相对较长的问题上（如文本大小），我们经常误解/忽略作者真正想问的问题，因为我们中的一些人会迷失在其他小问题中，而这些小问题在更大的问题中存在：）
css('class').set('color', 'red');

var css = function(classname, style) {
  var x = document.getElementsByClassName(classname);
  for(i = 0; i < x.length; i++){
    for(var s in style) {
      if(style.hasOwnProperty(s)) {
        x[i].style[s] = style[s];
      }
    }
  }
}

css('class', { color: 'red' });