使用<a>標籤或任何標籤的JavaScript鏈接？

即

你可以有一個超鏈接a其中href點#與class或id，然後JavaScript代碼查找的元素on-click事件。
您可以擁有一個簡單的div或span，其中包含class或id，並將javascript on-click綁定到該元素。

我已經看到兩者都完成了。

上下文是在rails應用程序中使用JavaScript的一些功能。

2014-08-27 Michael Durrant

如果您不想跟隨鏈接，請記住'返回false'onclick。 http://stackoverflow.com/questions/1291942/what-does-javascriptvoid0-mean/1291950#1291950 – mplungjan 2014-08-27 12:14:14

是否類似於'preventDefault（）'（或更新的'defaultPrevented'）？ – 2014-08-27 12:18:11

帶有hrefs的元素會自動添加到[* document.links *]（http://www.w3.org/html/wg/drafts/html/master/dom.html#dom-document-links）集合中，腳本鏈接不是。 – RobG 2014-08-27 12:19:58

這是一個比javascript更多的HTML問題。

一個元素很簡單，可以在每個瀏覽器中工作，並且無論腳本是否可用都非常可靠。
瀏覽器支持通過上下文菜單特徵的元素在新窗口或標籤
一個元素在瀏覽器中默認的外觀，讓用戶知道他們是沒有任何其他腳本或樣式支持鏈接打開它們需要
不同的瀏覽器可能會呈現略微不同的鏈接，因此用戶習慣於以瀏覽器呈現它們的特定方式來看待它們的行爲。腳本化和樣式化的其他元素可能會以不熟悉的方式呈現給至少一些用戶。
瀏覽器提供了支持A元素鏈接的功能，例如鏈接之間的標籤導航和頁面中單獨的鏈接列表。
屏幕閱讀器和其他支持機制，無障礙瞭解元素鏈接，可以將它們呈現給他們的用戶
瀏覽器通常存在的一個元素鏈接到用戶的目標，使他們可以決定是否跟隨鏈接或不
A元素URL被容易被複制，沒有以下的鏈接
A元素可用於創建書籤，而不必遵循鏈接

腳本共享和風格的鏈接不具有任何的上述特徵，或在最不需要重要的額外努力支持其中任何一項。

來源

2014-08-27 12:32:30 RobG

我認爲使用<a>標籤的主要優點是默認行爲（包括href時）是瀏覽器光標表示鏈接。雖然兩者都可以完成，但使用<a>標籤也更具語義。

來源

2014-08-27 12:13:17

+1謝謝。我想知道它是否根據正在完成的功能而變化。也許有些情況下，翻滾和（例如）手形符號會遮蓋內容。儘管我現在無法想到一個具體的例子。在適當的情況下，雖然標籤可能具有（？）翻轉和屏幕閱讀器的替代文字和標題的巨大優勢？ – 2014-08-27 12:17:18

構建語義標記是一個很好的設計。通過使用錨點來表示導航，您將堅持使用specification。如果你需要偏離，我會確保你的改變是合理的。

一個優勢更喜歡一個錨標籤是屏幕閱讀軟件爲盲人將解析DOM的錨點，以幫助用戶瀏覽頁面。通過使用div或span，導航鏈接將被忽略。

來源

2014-08-27 12:21:16 cgatian

+1爲輔助角度。 – RobG 2014-08-27 12:22:44

@RobG謝謝！它通常被忽視:) – cgatian 2014-08-27 12:24:31

我喜歡寫代碼，實際上意味着什麼。我通常通過使用最合適的（語義）元素來實現這一點。

當目的是在應用程序中導航時，我使用a元素。引述spec：

鏈接是一個概念性的結構[...]代表兩種資源

對於其他案件之間的連接，它依賴。但我通常使用button元素
div根據定義沒有意義，您應該爲了這種目的避免它們。引述spec：

作者強烈建議查看div元素作爲最後一個元素，在沒有其他因素是合適的。

來源

2014-08-27 12:21:24 aymericbeaumet

如果它是一個僅限JavaScript的鏈接，那麼附加它的內容並不重要，但使用<a>可以在語義上正確的情況下爲您提供內置的鏈接/懸停/訪問樣式。但是，使用實際鏈接的最大原因是能夠在沒有啓用JS的情況下使瀏覽器退步。

例如，如果遵循鏈接，您可以在鏈接中加載ajax的下一個10個結果（如果可能的話），否則在服務器端加載。

<a id="nextByAjax" href="?next=10">Next 10</a>

來源

2014-08-27 13:00:38 Moob

使用<a>標籤或任何標籤的JavaScript鏈接？

回答

相關問題