什么是<button onclick=…>之間</button>的區別

Question

我發現很多次頁面都使用“a”標簽，並希望將其設為按鈕。 它是這樣的：

<a href="#" class="button" onclick="...." />

我很困惑為什么不只是使用“按鈕”標簽？ 像這樣：

<button onclick="....">button</button>

有什么區別？ 我真的想學習它，謝謝！

還有一個情況問題：

三個“按鈕式<a>標簽”如下：

暗示：

• 不同的人打電話給ajax然后得到不同的期間記錄
• 需要使用onclick =“location.replace（）”因為順利回到最后一頁。

原始代碼：

<a href="url" class="btn" >Today</a> 

我改為：

<a href="#" onclick="location.replace(url)" class="btn" >Today</a> 

考慮關於：

<button onclick="location.replace(url)">Today</button>

在這種情況下你會做什么？ 使用按鈕標簽有什么不對嗎？

Answer 1

所以這里的答案是：語義。

錨點應該用於超鏈接。 用於從一個頁面移動到另一個頁面的導航項目。 它是用戶可以通過單擊鏈接獲得的數據的引用。

按鈕是一個按鈕。 它用於功能。

在你的例子中，他們都在調用onclick事件，所以他們只會有一個區別。 對於錨點，您必須使用event.preventDefault()覆蓋默認行為。

此外，谷歌的前3名成績：

http://davidwalsh.name/html5-buttons

HTML / CSS - 按鈕 - 何時使用什么

http://www.reddit.com/r/Frontend/comments/1y9zdh/anchor_vs_button_a_question_on_html_semantics/

Answer 2

這基本上是一件歷史文物。

它源於將定制樣式應用於錨點更容易的時間。 您可以通過在錨本身內使用更多元素輕松構建自動調整大小的“按鈕外觀”錨點。

今天，通過增強的CSS選項和更好的瀏覽器兼容性，這不是必需的。 當button是正確的語義元素，你沒有理由使用a替代。

因此，使用錨點來鏈接到其他頁面。 它應該總是有一個href ，而不是只使用#和onclick 。 現在，您仍然可以使用onclick - 只需確保href將您引導至與onclick相同的數據。 當您希望為搜索機器人導航您的站點時，這非常方便，即使實際用戶將被呈現例如更具響應性的界面（例如，通過AJAX下載更新的內容）。 確保在新窗口/選項卡中打開鏈接的常用方法仍然有效（ctrl + click，右鍵單擊和中鍵單擊都不應執行onclick操作）。

按鈕是與您當前所在頁面交互的元素，無論是執行客戶端腳本還是將表單發送到服務器。

編輯 ：

通過編輯您的問題，很明顯您應該只使用具有正常href的錨點。 我們沒有理由為使用onclick或button ，而你只是制作一個簡單的超鏈接，這就是錨的。