jquery的樣式操作，類操作（新增 刪除 css）
阿新 • • 發佈：2018-12-26
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> div { width: 100px; height: 100px; background-color: pink; } .current { background-color: red; } </style> <script src = jquery-1.11.1.js></script> <script> $(function () { //-------------------------------樣式操作方法-------------------------------- //樣式操作方法1(設定樣式)： css(json); // $("div").css({"width":100,"height":100,"background-color":"pink"}); //樣式操作方法2(設定樣式)： css(屬性，值); $("div").css("background-color","red"); //樣式操作方法2(獲取樣式)： css(屬性); //獲取的時候如果有很多，那麼獲取jquery物件中的第一個 alert($("div").css("width")); //------------------類操作新增和刪除、切換、判斷---------------------------------- $("button").eq(0).click(function () { //新增類 $("div").addClass("current"); //判斷類 alert($("div").hasClass("current"));//has是have的單三 返回bool型別 }); $("button").eq(1).click(function () { //刪除類 $("div").removeClass("current"); //判斷類 alert($("div").hasClass("current"));//has是have的單三 }); //alert($("div").hasClass("current")); // jquery物件中有一個帶有類名的也是true，所有都不帶才是false； }) </script> </head> <body> <button>新增</button> <button>刪除</button> <div></div> <div></div> <div></div> <div class="current"></div> </body> </html>