javascript - 使用 dojo 将 css 样式应用于具有相同 css 类的多个节点

Question

我一直在应用或更改 javascript 脚本中 CSS 类的样式，有一个 dojo f/w，像这样，

this.sidePanel = query(".sidePanel", document.body())[0];
domStyle.set(this.sidePanel, {
    height: "25%",
    top: "334px"
});

这工作得很好，但现在我有多个具有类似 CSS 类的节点。我希望将新的 CSS 样式应用于类，从而使所有节点都具有相同的类。

dojo 中是否有一些功能可以直接更改 CSS 类的样式而无需查询节点？就像是，

dojo.css.applyNewStyle('className', {'cssProperty': 'newValue'});

score 3 · Accepted Answer

该dojo/query函数返回一个您可以操作的节点列表。如果您还需要dojo/NodeList-dom扩展模块dojo/query，您可以执行以下操作：

require(['dojo/query','dojo/NodeList-dom','dojo/domReady!'],function(query){
    query('.red').style('background-color','black'); 
});

我做了一个快速的jsfiddle来演示这一点。dojo 参考指南列出了您可以在节点列表上调用的其他方法，包括添加一个 css 类，这可能是您想要的（如果您的新 css 值是静态的而不是动态的）。

score 1 · Accepted Answer

如果你不想包含 dojo/NodeList-dom 模块，你仍然可以这样做：

query(".sidePanel").forEach(function(node){ domStyle.set(node, { height: "25%", top: "334px" })});

...但是是的，dojo/NodeList-dom 更简洁 :-)

score 0 · Accepted Answer

是的，似乎有一种方法，但您不需要使用 dojo。看看这个其他帖子：

3 回答 3