首頁 > web前端 > js教程 > JavaScript關於變色的實例分享

JavaScript關於變色的實例分享

黄舟
發布: 2017-08-09 11:00:31
原創
1842 人瀏覽過

現在我們利用javascript的只是來做一個變色的小例子,具體步驟如下所示。


1.第一步:

先建立一個HTML檔:

JavaScript關於變色的實例分享

2.第二步:

書寫script程式碼:

<body>
  <div id="a1" onclick ="color();"></div>
    
</body>
<script>
    function color() {
        var div = document.getElementById("a1");
        div.id = "a2";
    }
</script>
登入後複製

JavaScript關於變色的實例分享

#3.第三個步驟:

##樣式:

<style>
    div
    {
        width:660px;
        height:660px;
    }
    #a1
    {
        background :green;
    }
    #a2
    {
        background :red;
        
    }
 
 </style>
登入後複製

JavaScript關於變色的實例分享

4.第四步:

#運行結果:

JavaScript關於變色的實例分享

##5.第五步:

點選變色:

JavaScript關於變色的實例分享#小夥伴們,現在可以自己動手試試了~

#

以上是JavaScript關於變色的實例分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板