18点击一个按钮,设置div的样式(通过调用类样式)

<style type="text/css">
            div {
                width: 200px;
                height: 200px;
                background-color: #008000;
                border: 3px solid #9895F7;
            }
        </style>
<input type="button" value="设置样式" id="btn21" />
        <div id="dv"></div>
        <script type="text/javascript">
            //凡是css中这个属性是对个单词的写法,在jsDOM操作的时候,把-去掉,
            //后面单词的首字母大写即可.比如:background-color 写成 backgroundColor
            function my$(id) {
                return document.getElementById(id);
            }
            my$("btn21").onclick=function(){
                // var dvObj=my$("dv");
                // dvObj.style.width="200px";
                // dvObj.style.height="200px";
                // dvObj.style.backgroundColor="#008000";
                // dvObj.style.border="3px solid #9895F7";   //样式太多,用下面这种调用方式
                
                //在js代码中DOM操作的时候,设置元素的类操作,不用class关键字,应该用className
                my$("dv").className="cls";//调用类
            };
            
        </script>

 

posted @ 2019-08-28 14:59  鱼七姑娘  阅读(1530)  评论(0编辑  收藏  举报