javascript實(shí)現(xiàn)控制div顏色
更新時(shí)間：2015年07月07日 10:34:25 投稿：hebedich
本文給大家分享的是使用javascript實(shí)現(xiàn)控制DIV背景色的代碼，非常的簡(jiǎn)單實(shí)用，有需要的小伙伴可以參考下。
js控制div顏色
<html>
<head>
</head>
<style>
#div1{width:400px;height:400px;background-color:red;}
</style>
<script>
function blue(){
div1=document.getElementById('div1');
div1.style.backgroundColor='blue';
}
function pink(){
div1=document.getElementById('div1');
div1.style.backgroundColor='pink';
}
function black(){
div1=document.getElementById('div1');
div1.style.backgroundColor='black';
}
</script>
<body>
<button onclick='wr();'>生成文字</button>
<button onclick='blue();'>blue</button>
<button onclick='pink();'>pink</button>
<button onclick='black();'>black</button>
<div id='div1'>
</div>
以上所述就是本文的全部?jī)?nèi)容了，希望大家能夠喜歡。
您可能感興趣的文章:
- JavaScript獲取系統(tǒng)自帶的顏色選擇器功能（圖）
- 5款Javascript顏色選擇器
- JavaScript取得WEB安全顏色列表的方法
- javascript實(shí)現(xiàn)rgb顏色轉(zhuǎn)換成16進(jìn)制格式
- JavaScript實(shí)現(xiàn)自動(dòng)變換表格邊框顏色
- Javascript實(shí)現(xiàn)顏色rgb與16進(jìn)制轉(zhuǎn)換的方法
- JavaScript動(dòng)態(tài)修改背景顏色的方法
- Javascript實(shí)現(xiàn)Web顏色值轉(zhuǎn)換
- javascript實(shí)現(xiàn)十六進(jìn)制顏色值（HEX）和RGB格式相互轉(zhuǎn)換
- javascript實(shí)現(xiàn)根據(jù)3原色制作顏色選擇器的方法
相關(guān)文章
ES6新特性之函數(shù)的擴(kuò)展實(shí)例詳解
這篇文章主要介紹了ES6新特性之函數(shù)的擴(kuò)展,實(shí)例形式較為詳細(xì)的分析了ES6針對(duì)函數(shù)參數(shù)、運(yùn)算符及相關(guān)新特性的擴(kuò)展操作與注意事項(xiàng),需要的朋友可以參考下2017-04-04
three.js中文文檔學(xué)習(xí)之創(chuàng)建場(chǎng)景
這篇文章主要給大家介紹了three.js中文文檔學(xué)習(xí)之創(chuàng)建場(chǎng)景的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用three.js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2017-11-11
javascript實(shí)現(xiàn)的淘寶旅行通用日歷組件用法實(shí)例
這篇文章主要介紹了javascript實(shí)現(xiàn)的淘寶旅行通用日歷組件,以實(shí)例形式分析了該日歷組件的相關(guān)設(shè)置及使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
這篇文章主要介紹了ES6中Set和Map用法,結(jié)合實(shí)例形式詳細(xì)分析了ES6中Set和Map的基本功能、原理、使用方法及操作注意事項(xiàng),需要的朋友可以參考下2020-03-03
這篇文章主要介紹了e2e測(cè)試之cypress的使用方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
laypage+SpringMVC實(shí)現(xiàn)后端分頁(yè)
這篇文章主要為大家詳細(xì)介紹了laypage+SpringMVC實(shí)現(xiàn)后端分頁(yè)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要介紹了Vue 組件渲染詳情，文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-08-08
原生js實(shí)現(xiàn)簡(jiǎn)單的Ripple按鈕實(shí)例代碼
本篇文章主要介紹了原生js實(shí)現(xiàn)簡(jiǎn)單的Ripple按鈕實(shí)例代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下。2017-03-03
JavaScript版DateAdd和DateDiff函數(shù)代碼
VBScript中有兩個(gè)非常好用的日期操作函數(shù)：DateAdd用來(lái)給日期添加指定時(shí)間間隔，DateDiff用來(lái)返回兩個(gè)日期的時(shí)間間隔?？上У氖荍avaScript沒(méi)有，不過(guò)我們可以寫(xiě)一個(gè)函數(shù)來(lái)實(shí)現(xiàn)，一樣的，呵呵2012-03-03
layui監(jiān)聽(tīng)單元格編輯前后交互的例子
今天小編就為大家分享一篇layui監(jiān)聽(tīng)單元格編輯前后交互的例子，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09