js自定義屬性以及自定義一組開關應用

2022-05-23 11:06:10 字數 709 閱讀 7472

任何的html標籤都有自己的乙個屬性,當時那都是它本身的固定屬性,而我們在專案中可能會遇到需要給標籤新增一些自定義的屬性,去判斷替換內容或者賦值等等,那麼就需要給標籤設定乙個屬性來作為判斷標準或者賦值的標準,所以今天就來談談給標籤自定義屬性的乙個小應用。

案例:三個div有背景色,想要達到效果是點選任何乙個給替換顏色再次點選,還給還原回來,各自的div不影響其他的div,也可以都點選都變色,相反都還原。

好的,話不多說,我們來看**,先來看下簡單的布局:

1

<

style

>

2ul,li3ul

4li5style

>

6<

body

>

7<

ul id

="list"

>

8<

li>

li>

9<

li>

li>

10<

li>

li>

11ul

>

12body

>

目前不加js的效果就是三個灰色的方形,那麼來看js

1

好的,就是這樣,主要需要提醒的就是因為要div互不影響,在設定開關來控制的時候,一定是各自是各自的開關,所以必須寫進for迴圈裡面。

好了,就是這樣,加油!

js自定義屬性

1 js中設定自定義屬性。例如 div info attr testattr3 houhou 結果 給div設定了新的自定義屬性testattr3,值為houhou 2 js中獲取自定義屬性值。例如 div info attr testattr 結果 取到testattr的值為 myattr 3 j...

js自定義屬性

1 js中設定自定義屬性。例如 div info attr testattr3 houhou 結果 給div設定了新的自定義屬性testattr3,值為houhou 2 js中獲取自定義屬性值。例如 div info attr testattr 結果 取到testattr的值為 myattr 3 j...

js 自定義屬性

自定義屬性操作 1.獲取屬性值 區別 2.設定屬性值 區別 3.移除屬性 h5自定義屬性 1.h5規定自定義屬性 2.獲取h5自定義屬性 1.相容性獲取 element.getattribute data index 2.h5新增 elemen.dataset.index 或者 element.da...