From 68b6aba0b2a1f8005e1c181c06e40eea4af9cd2f Mon Sep 17 00:00:00 2001 From: MDN Date: Sun, 4 Jul 2021 00:36:02 +0000 Subject: [CRON] sync translated content --- .../api/htmlorforeignelement/dataset/index.html | 168 --------------------- 1 file changed, 168 deletions(-) delete mode 100644 files/zh-tw/web/api/htmlorforeignelement/dataset/index.html (limited to 'files/zh-tw/web') diff --git a/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html b/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html deleted file mode 100644 index 699dec949f..0000000000 --- a/files/zh-tw/web/api/htmlorforeignelement/dataset/index.html +++ /dev/null @@ -1,168 +0,0 @@ ---- -title: HTMLElement.dataset -slug: Web/API/HTMLOrForeignElement/dataset -translation_of: Web/API/HTMLOrForeignElement/dataset -original_slug: Web/API/HTMLElement/dataset ---- -

{{ APIRef("HTML DOM") }}

- -

HTMLElement.dataset 允許在讀取與寫入模式時使用HTML或DOM裡,所有設置在元件上的自定義資料屬性(data-*)。他是一個DOMStringMap,每個項目表示一個不同的資料屬性。須注意的是,資料集(dataset)可以被讀取,但不能直接被修改。所有修改必須經由其眾多"屬性"才行,也就是資料屬性。另外,雖然HTML data- 屬性與它相關的 DOM dataset. 名稱不同,但是他們總是有相似之處: 

- - - -

除了以下的資訊之外,你也可以在 Using data attributes.此篇文章找到使用HTML資料屬性的用法。

- -

名稱變換

- -

 

- -

dash-style 到 camelCase: 將自訂義的資料屬性名稱變換至{{ domxref("DOMStringMap") }}各項目的key值,需根據以下規則:

- - - -

camelCase 到 dash-style: 與上述相反,將key值轉為資料屬性名稱,需根據以下規則:

- - - -

上面所提的限制是為了確保兩個轉換方法互為相反。

- -

舉例來說,資料屬性名稱 data-abc-def 之對應key值為abcDef

- -

 

- -

存取數值

- - - -

語法

- - - -

範例

- -
<div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth>John Doe</div>
-
-let el = document.querySelector('#user');
-
-// el.id == 'user'
-// el.dataset.id === '1234567890'
-// el.dataset.user === 'johndoe'
-// el.dataset.dateOfBirth === ''
-
-el.dataset.dateOfBirth = '1960-10-03'; // 設定 DOB.
-
-// 'someDataAttr' in el.dataset === false
-el.dataset.someDataAttr = 'mydata';
-// 'someDataAttr' in el.dataset === true
-
- -

規範

- - - - - - - - - - - - - - - - - - - - - - - - -
規範狀態備註
{{SpecName('HTML WHATWG', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML WHATWG')}}No change from latest snapshot, {{SpecName('HTML5.1')}}
{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}
{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}{{Spec2('HTML5 W3C')}}Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.
- -

瀏覽器相容性

- -

{{ CompatibilityTable() }}

- -
- - - - - - - - - - - - - - - - - - - - - -
功能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
基本支援8{{CompatVersionUnknown}}{{ CompatGeckoDesktop("6.0") }}1111.106
-
- -
- - - - - - - - - - - - - - - - - - - - - -
功能AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本支援{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile(6)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
-
- -

參見

- - -- cgit v1.2.3-54-g00ecf