關於在JavaScript調用css的兩種方式__JavaScript

來源:互聯網
上載者:User
程式碼範例如下:

<!doctype html><html lang="en"> <head>  <meta charset="UTF-8">  <meta name="Generator" content="EditPlus?">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <title>滑鼠的懸停及移出事件</title><style type="text/css">.one{color:red ;border:6px solid green ;cursor:hand;}</style> </head><script type="text/javascript"><!--/*如何通過JavaScript調用css:方式一:通過style對象方式二:通過className指定類別選取器*/function fun(){//拿到p標籤對象var p = document.getElementById("p") ;//定義p的樣式//p.style.color = "red" ;              //第一種方式:通過style//p.style.border = "5px dashed green" ;p.style.backgroundColor = "red" ;   //原本在css中,背景顏色的屬性為background-color,                                                        //但是由於是在JavaScript中去調用                                                         //其不允許存在 “-” ,所以需要改寫為backgroundColorp.className = "one" ;               //第二種方式:通過className指定類別選取器}function fun1(){//拿到p標籤對象var p = document.getElementById("p") ;p.className = "" ;}//--></script> <body>    <p onmouseover = "fun()" onmouseout= "fun1()" id = "p">你好</p> </body></html>



相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.