唯一哈希在錨href？

在我工作的項目中，我最近從開發後端（即非Web）服務器轉移到了與Web相關的東西。在HTML代碼中，我發現了以下事情所有的地方：唯一哈希在錨href？

<a href='#'>some link</a>

那麼一些JS連接到click事件<a>元素。

這個唯一的散列有什麼特別的含義嗎？我瞭解href='#some_id'如何通知瀏覽器滾動到ID爲some_id的元素。但href='#'不會這樣工作，對吧？如果只是創建一個可點擊的文本片段，爲什麼不簡單地使用<span>？

來源

2011-07-04 Jasiu

如果您將href留空，它將重新加載當前頁面，這就是爲什麼存在＃... –

@webardo - true，但它比這更復雜。隨着散列，它會跳轉到頁面的頂部，這也不可能被通緝。這些事情通常是在javascript返回false的情況下完成的，這會阻止執行'href'動作。散列仍然比空字符串好，因爲如果用戶禁用Javascript然後點擊鏈接，它會減少意想不到的後果。 – Spudley

也發現這個令人大開眼界：https://stackoverflow.com/questions/5637969/is-an-empty-href-valid – Leo

沒錯。你在這裏看到的是某種不好的設計（儘管使用href="#"是很常見的）。

如果不阻止默認操作，它實際上會跳到頁面的頂部。

好多將

使用<button>和風格也相應地（甚至僅通過JavaScript插入）
或讓該鏈接指向一些真正的資源（觸發服務器上的一些動作側）並附加JavaScript事件處理程序以在客戶端上執行此操作（或類似操作），並阻止遵循該鏈接（關鍵字：unobtrusive JavaScript）。

這也取決於該網站是否打算使用禁用的JavaScript運行。如果是的話，那麼這樣的鏈接（但也是一個按鈕）將不起作用。

但是無論如何，從語義的角度來看，使用鏈接僅僅是爲了擁有「可點擊」的東西是錯誤的。

來源

2011-07-04 14:05:06

我更喜歡'href'激活一些服務器端操作，'onclick'在最後有一個'return false'，這樣支持js的瀏覽器就不會再執行服務器端的操作。 – Emyr

@Emyr：這實際上就是我的意思:) –

因爲您希望瀏覽器將此鏈接設置爲與所有其他鏈接相同，且無需指定（例如，使用class）「您知道，我希望它看起來像一個鏈接，即使它在技術上不是」。這對於可維護性來說確實不好。

來源

2011-07-04 14:04:18 Jon

因爲：

造型爲您完成;
鏈接在語義上仍然是一個鏈接，即使它開始時沒有任何操作href。

反問：
你能解釋一下爲什麼你認爲一個span比a中的鏈接更合適？

附錄：
像一個button或其他動態元素可能更適合這裏，但以文字和假裝這是一個連接的非連接span是糟糕。

來源

2011-07-04 14:04:59

這個唯一的哈希值是否有特殊含義？

它鏈接到頁面

頂部爲什麼不能簡單地用一個<span>？

它不會成爲焦點順序
它不會採取默認樣式的東西應該被點擊

一個<button>會比一個更好的跨度。 built on top of a server side alternative會是最好的。

來源

2011-07-04 14:05:41 Quentin

包含到焦點順序似乎是一個非常好的理由。有沒有其他方法可以在焦點順序中包含某些元素？ – Jasiu

'tabindex'在一些瀏覽器中，但這是一個可憐的替代品有一個明智的後備鏈接或提交按鈕。 – Quentin

它自己的鏈接到頁面頂部的散列。

這有時用於確切的目的 - 即「返回頂部」鏈接，但更典型的是，這種鏈接與Javascript單擊結合使用，即使返回false也是如此，從而否定了HREF。

在這種情況下，以這種方式用於以下原因：

的<a>標籤可能是語義正確的 - 即可以點擊充當鏈接的項目;即加載更多內容，或者打開一個彈出窗口等，即使它使用Javascript來實現它的功能。
使用<a>標籤還意味着該元素的樣式將與網站上其他<a>標籤的樣式相同。這包括:hover效果款式等，需要注意的是IE6只支持:hover上<a>元素，沒有別的，這意味着，如果網站的目的是在IE6工作或仍需要支持的話，那麼你就不能與其他複製這一功能標籤。這是在過去使用<a>標籤的一個很好的理由，即使它在語義上不合適。現在這不是什麼問題。即使在現代瀏覽器中，如果您希望它們看起來與其他鏈接相同，那麼對於這些項目使用<a>對於減少複製樣式表仍然很有用。鏈接也有少數的其他特殊功能可能難以與其他元素，如標籤索引序列中被複制，等等
HTML要求一個<a>標籤具有在順序href屬性的元素被渲染爲一個鏈接，所以哈希被用作這個的最小值。此外，在href屬性中加入散列表示如果用戶關閉Javascript或開發者忘記到return false;，鏈接不會導致任何令人討厭的意外後果。相反，有一個空字符串會導致它重新加載頁面，如果你只是運行一些JavaScript，這不太可能是你想要的。然而，將鏈接指向有效的URL也是很常見的，如果Javascript被關閉，該URL將被運行;這是爲您的網站建立回退機制的好方法。但這並不總是合適的，顯然這裏並不是這個意圖。

鑑於該項目只是觸發的Javascript點擊事件，沒有理由爲什麼你不能使用任何其他元素這一點。您可以非常方便地使用<span>（或更好，<button>），但以上幾點應顯示使用<a>標記沒有任何問題。

希望有所幫助。

來源

2011-07-04 14:31:43 Spudley

在一個href中的散列實際上是很好的做法，並且絕對比樣式化的跨度（或更糟糕的是，一個按鈕）更好。 a標籤中的散列值也可以替換爲href="javascript:;"，這樣可以防止'去頂部'。

在一個href中的散列是一個主要的跡象，有JavaScript連接到該錨。

對於推薦一個按鈕的人來說，這是一個表單元素，請不要在表單外部使用它。

如前所述，跨度是可能的，但不會收到標籤焦點，並且沒有任何語義含義（以前也注意到）。

因此，要回顧：

好：

<a href="#">click</a> 
<a href="javascript:;">click</a>

有點兒好：

<span>click</span>

不好的做法

<button>click</button>

來源

2015-09-01 12:00:32 Wannes

很好的解釋。謝謝。 –

按鈕不只是表單。也許你正在考慮一個'提交'類型的按鈕？標籤用於鏈接，並且按鈕可以並且應該用於任何可點擊的元素。造型照顧其餘。 – rgilligan

唯一哈希在錨href？

回答

相關問題