如何在 HTML 中維持連結樣式?教你使用 A 標籤不設定 href 屬性的方法

在 A 標籤中,如果沒有 href 屬性,就不會是連結樣式,看起來會和一般的文字一樣,但是如果增加空的 href 屬性,在點擊時就會重新整理頁面。

沒有連結樣式:
    
<a>這是一個連結</a>
    

會有連結樣式,但點擊後會重新整理頁面:
    
<a href="">這是一個連結</a>
    

有嘗試過 class="link-style" 但是沒有用。

解法

經過一翻研究,最後研究出兩個方式:

內部連結

在 href 內放置 #,就會被當成內部連結,不會重新整理頁面,但是缺點是 URL 後面會多出 #
    
<a href="#">這是一個連結</a>
    

阻止事件

可以使用 onclick="return false;" 利用 JavaScript 防止預設事件處理程序被觸發,也可以達到保持連結樣式,並且不會跳轉頁面,並且也不會變更 URL
    
<a href="" onclick="return false;">這是一個連結</a>
    

留言