天天看點

jquery操作元素的樣式

jquery操作元素的樣式

                1、使用css()

                        對象名.css("屬性名")//傳回目前屬性的樣式值

                        對象名.css("屬性名","屬性值")//增加、修改元素的樣式

                        對象名.css({"樣式名":"樣式值","樣式名":"樣式值"……})//使用json傳參,提升代碼書寫效率。

                2、使用addClass()

                        對象名.addClass("類選則器名")//追加一個類樣式

                        對象名.removeClass("類選擇器 名")//删除一個指定的類樣式

<script type="text/javascript">

            //jQuery操作樣式---css()

                function testCss(){

                    //擷取元素對象

                        var showdiv=$("#showdiv");

                    //操作樣式--增加

                        showdiv.css("background-color","orange");

                    //操作樣式--擷取

                        alert(showdiv.css("width"));        

                }

                function testCss2(){

                    //擷取元素對象

                        var div=$("#div01");

                    //操作樣式

                        div.css({"border":"solid 1px","width":"300px","height":"300px"});    

                }

            //jquery操作樣式--addClass()

                function testAddClass(){

                    //擷取元素對象

                        var div=$("#div01");

                    //操作元素樣式

                        div.addClass("common");    

                }

                function testAddClass2(){

                    //擷取元素對象

                        var div=$("#div01");

                    //操作元素樣式

                        div.addClass("dd");    

                }

                function testRemoveClass(){

                    //擷取元素對象

                        var div=$("#div01");

                    //删除元素樣式

                        div.removeClass("dd");    

                }    

        </script>

轉載于:https://my.oschina.net/wzh001/blog/3027812

繼續閱讀