Question

JS、Html如何动态改变button控件指向的CSS样式

在Html文件中定义了一个button控件，如下：
<button id="ca" dojoType="dijit.form.DropDownButton" iconClass=c1 data-dojo-props='style:"width:50px;height:50px;",onClick:function(){functionA();}'>...中间定义若干item</button>

如何通过事件触发，动态改变button id="ca" 的iconclass的属性值？
希望大家帮忙解决，O(∩_∩)O谢谢各位~

Answer 1

1. 准备多组CSS，比如：

        .button1{

        /*style1*/

        }

    

      .button2{

        /*style2*/

        }

2. 在用JavaScript修改Button的class，把button1改成button2，就实现了指向的CSS样式改变。

Answer 2

doucment,getElementById('ca').iconClass = c2;试试，如果有这个属性的话直接改名字就行，因为你这是定义的控件，所以我不知道他是否有这个属性

追问

没有用~用className就可以，是什么问题呢？用className=C1，但是控件怪怪的

追答

className是样式的名称，那就用这个不就行了
我真看不出来你是用什么服务器语言的

追问

改用className后，控件显示就变成了这样，头大、、、怎么会这样呢。那个箭头和里面的下拉菜单选项重叠了

追答

那这个是你样式的问题啊，改css呗

Answer 3

document.getElementById('ca').className='xxxx';

追问

需要显示的图片和原有的图片叠加在一起了，而且出现了三个，如下图，是什么问题呢？

追答

代码贴全些，可能是js代码中有相关操作

追问

html中的代码在问题中显示了 其中内含的item是dijit.MenuItem类型的，触发事件是 function a()
JS的代码这样写的
function a(){
document.getElementById("combinedarrow").className="C2";//C2是另一种CSS文件的名称
};

Answer 4

可用js来操作button对象