原生js實現按鈕改變顏色其他顏色不變的操作

2021-10-07 21:57:25 字數 2091 閱讀 3142

這個使用預設定類名再新增

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

document<

/title>

li.active

<

/style>

<

/head>

"example"

>

按鈕一<

/li>

按鈕二<

/li>

按鈕三<

/li>

按鈕四<

/li>

按鈕五<

/li>

按鈕六<

/li>

按鈕七<

/li>

按鈕八<

預設顏色名再按鈕裡,再提取顏色名並設定顏色

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

document<

/title>

*.list

button

.btn

p<

/style>

<

/head>

="list"

>

="btn1" data-color =

'yellow'

>黃色<

/button>

="btn1" data-color =

'green'

>綠色<

/button>

="btn1" data-color =

'blue'

>藍色<

/button>

="btn1" data-color =

'pink'

>粉色<

/button>

="btn1" data-color =

'purple'

>紫色<

/button>

<

/div>

="btn"

>改變字型顏色<

/button>

字型<

/p>

<

/body>

<

/html>

var btn = document.

queryselector

('.btn');

var p = document.

queryselector

('p'

)var child = document.

queryselectorall

('.btn1'

)for

(var i =

0;i)else

} btn.

onclick

=function()

}})(

)}

原生js實現點選按鈕複製文字

封裝函式引數 id 要複製的元素id,paramtype 複製的屬性內容,一般是innertext copywxid id,paramtype else else try catch e if paramtype 原理總結 1.先建立全透明div,並把要複製的內容放入其innertext 2.建立r...

原生 js 實現點選按鈕複製文字

最近遇到乙個需求,需要點選按鈕,複製 標籤中的文字到剪下板 之前做過複製輸入框的內容,原以為差不多,結果發現根本行不通 嘗試了各種辦法,最後使了個障眼法,實現了下面的效果 一 原理分析 瀏覽器提供了 copy 命令 可以複製選中的內容 document.execcommand copy 如果是輸入框...

Android按鈕按下的時候改變顏色實現方法

需求是在我按下按鈕時,該變按鈕顏色,使使用者感覺到自己按了按鈕,當鬆開的時候,變回原來的顏色。正常時 按下時 有人說,直接監聽按鈕的按下事件不得了嘛,其實這樣確實能實現同樣的效果,但是有個缺點,比如很多按鈕都需要這樣的效果,那你同樣的 就要重複很多次。所以,還是要通用起來。首先,在res資料夾下新建...