將模塊的狀態存儲爲類或數據屬性會更好嗎？

考慮一個簡單的手風琴模塊，可以通過用戶輸入進行擴展或摺疊。將模塊的狀態存儲爲類或數據屬性會更好嗎？

如果模塊的狀態要存儲在DOM上，應該採用哪種方式實現？

作爲一類：

<article class="accordion-item expanded">...</article>

或作爲自定義數據屬性：

<article class="accordion-item" data-state="expanded">...</article> 
alternatively... 
<article class="accordion-item" data-expanded="true">...</article>

對於語義，可訪問性和性能，應該使用和爲什麼該方法？

來源

2014-03-03 Bryce

所有這三種方法在語義上是毫無意義的，也就是說，在類名或用戶沒有內在的語義價值 - 定義的自定義數據屬性，這兩者都不會影響標記的含義或結構。性能是你必須測量自己的東西。 – BoltClock

@BoltClock，一個參數可以被做出來，在DOM元素的類中存儲狀態可能不會在語義上代表類屬性的點。另外，即使不是嚴格意義上的「語義」，標記對於開發人員來說可以是語義的。 – Bryce

可訪問性，你需要做兩件事情之一：

使用WAI-ARIA創作準則手風琴http://www.w3.org/TR/wai-aria-practices/#accordion以必要的唱段的屬性和JavaScript事件處理程序鍵盤導航實現手風琴
將手風琴的狀態置於屏幕外的文字中，並在其發生變化時進行維護。您可以通過添加一個<span>到每篇文章的上方，並使用像這裏所描述的技術做到這一點：http://snook.ca/archives/html_and_css/hiding-content-for-accessibility

來源

2014-03-03 22:26:03 unobfuscator

將模塊的狀態存儲爲類或數據屬性會更好嗎？

回答

相關問題