關於 TeaMeow 如何星號的方法

螢幕快照 2015-08-12 上午4.00.14

說穿了,就只是一個下面這樣的按鈕而已

<button data-star-action="star"
        data-star-id="4"
        data-star-target="Meow"
        class="js-star-btn"></button>

這裡是他們的說明:

data-star-action 用來存放接下來應該「Star(星號)」還是「Unstar(取消星號)」的動作。
data-star-id        則是目標對象的編號。
data-star-target 則是目標的種類。


其實 Twitter 也是採用這種方法,但是他們不會將編號寫在按鈕上,

螢幕快照 2015-08-12 上午3.57.14

而是在包含這個按鈕的「容器」上,如此一來就不需要一直寫 data 的標籤到每一個按鈕

只需要取得這按鈕容器的標籤就可以了,那為什麼我不這樣做呢,

因為我想說統一化就好了,如果我選擇寫在容器上,每個地方的 HTML 不同,

取得容器的方式也有所不同,那不如我先暫時寫在按鈕上吧 ..

廣告

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s