2013-03-25 64 views
2

我已經顯示給終端用戶以下標記:我應該如何在td元素中存儲'額外'信息?

<td class="event-start"> Mon 25th Feb (2013) @ 01:00pm</td> 

和我正在開發一項功能,允許用戶編輯的事件開始時間。

但是,這種時間格式很難用(在jQuery中),因爲我已經爲最終用戶格式化了它,而不是將它顯示爲unix時間戳。

因此,我認爲在<td>元素的另一個屬性中存儲事件啓動(作爲Unix時間戳)的實際值可能更合適,例如,

<td class="event-start" actual-start="unix-timestamp"> Mon 25th Feb (2013) @ 01:00pm</td> 

我的問題是 - 這個屬性的名字應該是什麼?我應該使用這個屬性的標準名稱還是我應該遵循的任何約定?

回答

2

你應該研究HTML5自定義數據屬性。 W3C文檔HTML5 Working Draft

總之,您的屬性名稱前綴爲data-。這樣做可以通過元素上的JS dataset屬性專門訪問數據元素。

This article有着相當不錯的解釋/例子:

特別是:

定製的吸引力屬性是,它可以讓你輕鬆的信息 花絮與元素相關聯,稍後解析例如使用 JavaScript。有兩種方法可以通過JavaScript檢索 「data」屬性的值:第一種方法是通過JavaScript的getAttribute()方法,第二種方法是通過 訪問元素的「dataset」屬性。

重新兼容性,是指http://caniuse.com/#feat=dataset這表明所有當前的瀏覽器有部分支持,同時目前的瀏覽器都完全支持。 「完全支持」意味着屬性可以通過「數據集」屬性訪問。

但重要的是,

所有的瀏覽器已經可以用數據 - *的屬性和使用的getAttribute訪問它們。

+0

@Sheldon,感謝接受,大加讚賞。請注意,更新後的答案與其他筆記重新兼容。 – Sepster 2013-03-25 13:02:39

1

此屬性的名稱應該是什麼?我應該使用這個屬性的標準名稱還是我應該遵循的任何約定?

應該是data屬性

<td class="event-start" data-actual-start="unix-timestamp"> 

的數據屬性在所有主流瀏覽器的支持。而jquery有自己的方法來操縱數據屬性很容易.. doc here ...

相關問題