如何将类应用于所有按钮？答案

【问题标题】：How to apply a class to all button?如何将类应用于所有按钮？
【发布时间】：2009-07-24 07:10:53
【问题描述】：

在我的一个项目中，我使用input[type="button"] 将样式应用于所有按钮。它在除 Internet Explorer 6 之外的所有浏览器中都能正常工作。它不设置按钮样式。

是否有解决方案，例如为按钮创建一些类并将其应用于所有按钮？

我想将该类应用于所有按钮，但不是手动。我认为可以为此使用 jQuery，您能帮我解决这个问题吗？

【问题讨论】：

您能给我们举个例子，IE 出了什么问题。我怀疑这可能是一些在 IE 问题上没有正确解释的 CSS。

标签： javascript jquery css forms internet-explorer-6

【解决方案1】：

我通常不喜欢为此使用 JavaScript，所以我为 <input> 文本类型的元素添加 class="text"，为 <input> 按钮类型的元素添加 class="button"，等等。然后我可以将它们与input.text 等匹配。

虽然您不想手动执行此操作，但我认为这是更好的做法。如果你仍然想用 jQuery 来做，你可以这样做：

$('input:button').addClass('button');
// Or to include <button> elements:
$('button, input:button').addClass('button');

// Text inputs:
$('input:text').addClass('text');
// And so on...

【讨论】：

【解决方案2】：

$(":button").addClass("yourclassname");

这匹配所有按钮元素和按钮类型的输入元素，并为它们添加类。

【讨论】：

:button 表示*:button。我建议将其更改为 input:button。
那么你缺少
但是这些很容易与 CSS 匹配。如果我真的想将类添加到所有按钮，我宁愿制作 jQuery $("button, input:button")。这将比检查页面上的每个元素更有效。
对垃圾评论感到抱歉。我现在确实查看了源代码，:something 过滤器以如此通用的方式实现，它只是通过jQuery.expr.something 函数运行冒号之后的任何内容，在初始元素已经被选择之后的阶段，因此它将选择所有元素。但考虑到人们使用:text 等而不是input:text 的频率，我认为建议进行特殊情况优化可能值得...
@Blixt：非常好的观点。今天又学到了一些新东西 :) 我还检查了 jQuery 源代码，它让我吃惊 :xxx 过滤器的实现效率如此之低。

【解决方案3】：

你试过$(":button")吗？

【讨论】：

【解决方案4】：

在没有 javascript 的情况下，您无法在 IE6 中自动执行此操作。以下是使用 jQuery 的方法

$(":button").addClass( "something" );

【讨论】：

【解决方案5】：

除非您在其他地方需要它，否则我不会使用 jQuery，因为为这样一个简单的任务加载库或框架似乎有点矫枉过正。

I.E.6 不理解 CSS 属性选择器，正确，看起来 Javascript 是唯一的方法。

也许你可以玩一下这段代码：

Buttons=Parent.getElementsByTagName("input"); // "Parent" could be "document" or the Id. of a form, fieldset, div etc.
Button=0;
while(Button<Buttons.length){
    if(Buttons[Button].getAttribute("type")=="button"){
        Buttons[Button].className="Whatever_Style_We_Want";
    }
    Button++;
};

我没有尝试或测试过，但 sn-p 是可以玩的。它甚至可以开箱即用！

【讨论】：