首頁 web前端 html教學 html中a標籤href='#'與href='###'的差異分享

html中a標籤href='#'與href='###'的差異分享

Jul 27, 2017 pm 01:34 PM
href html 差別

  首先, 標籤+ onclick='{jscode}' 是很常用的一種js 運用方式,而不使用href='javascript:{jscode}' 是為了相容於多種瀏覽器對< a> 標籤的解釋和處理不同。其次,使用 標籤+ onclick='{jscode}'  時常會加一個href='

',而有時這個href='

' 會被誤寫為 是因為使用者沒有理解'#' 和'

' 的區別。

     簡單地說,就是說如果想定義一個空的鏈接,又不跳到頁面頭部,可以寫href="

"。詳細解釋就是 '#' 是有特定意義的,如果'#' 後有內容會被認為是一個標籤而從頁面找到相應標籤跳到該處,找不到時會跳到頁首, '

' 其實就是一個無意義的標籤指定,也就是一個'#' 和不存在的標籤'##' 的組合,頁面中找不到命名為'##' 的
時該連結就不會發生跳轉,也就不會導致執行onclick 中的內容時突然發生頁面跳到頁首的問題。 '###' 只是一種使用者習慣,如果你願意,可以隨便找一個跳轉不到的標籤作為命名。說白了"###" 是一個不是錨點的字串 瀏覽器找不到也不會跳到頁首,原理就是依賴了網頁的報錯機制,找不到就不做處理。 ######     有些人說,不喜歡「###」因為他會改變連結。都是使用一直用javascript:void(0)或javascript:。 href="javascript:void(0);"但也有人說用href="javascript:void(0);"可能會有瀏覽器相容問題。在做頁面時,如果想做一個連結點擊後不做任何事情,或者響應點擊而完成其他事情,可以設定其屬性href = "#",但是,這樣會有一個問題,就是當頁面有捲軸時,點擊後會回到頁面頂端,使用者體驗不好。 ######     javascript:void(0)這種偽協議,少寫的好,如果你看過一些web標準的書就知道為什麼了。 2.連結(href)直接使用javascript:void(0)在IE中可能會引起一些問題,例如:造成gif動畫停止播放等,所以,最安全的方法還是使用「####」。為防止點擊連結後跳到頁首,onclick事件return false即可。 ###

以上是html中a標籤href='#'與href='###'的差異分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

<🎜>:泡泡膠模擬器無窮大 - 如何獲取和使用皇家鑰匙
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系統,解釋
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆樹的耳語 - 如何解鎖抓鉤
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
<🎜>掩蓋:探險33-如何獲得完美的色度催化劑
2 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1676
14
CakePHP 教程
1429
52
Laravel 教程
1333
25
PHP教程
1278
29
C# 教程
1257
24
了解HTML,CSS和JavaScript:初學者指南 了解HTML,CSS和JavaScript:初學者指南 Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML,CSS和JavaScript的角色:核心職責 HTML,CSS和JavaScript的角色:核心職責 Apr 08, 2025 pm 07:05 PM

HTML定義網頁結構,CSS負責樣式和佈局,JavaScript賦予動態交互。三者在網頁開發中各司其職,共同構建豐富多彩的網站。

React在HTML中的作用:增強用戶體驗 React在HTML中的作用:增強用戶體驗 Apr 09, 2025 am 12:11 AM

React通過JSX與HTML結合,提升用戶體驗。 1)JSX嵌入HTML,使開發更直觀。 2)虛擬DOM機制優化性能,減少DOM操作。 3)組件化管理UI,提高可維護性。 4)狀態管理和事件處理增強交互性。

HTML:結構,CSS:樣式,JavaScript:行為 HTML:結構,CSS:樣式,JavaScript:行為 Apr 18, 2025 am 12:09 AM

HTML、CSS和JavaScript在Web開發中的作用分別是:1.HTML定義網頁結構,2.CSS控製網頁樣式,3.JavaScript添加動態行為。它們共同構建了現代網站的框架、美觀和交互性。

HTML的未來:網絡設計的發展和趨勢 HTML的未來:網絡設計的發展和趨勢 Apr 17, 2025 am 12:12 AM

HTML的未來充滿了無限可能。 1)新功能和標準將包括更多的語義化標籤和WebComponents的普及。 2)網頁設計趨勢將繼續向響應式和無障礙設計發展。 3)性能優化將通過響應式圖片加載和延遲加載技術提升用戶體驗。

HTML:建立網頁的結構 HTML:建立網頁的結構 Apr 14, 2025 am 12:14 AM

HTML是構建網頁結構的基石。 1.HTML定義內容結構和語義,使用、、等標籤。 2.提供語義化標記,如、、等,提升SEO效果。 3.通過標籤實現用戶交互,需注意表單驗證。 4.使用、等高級元素結合JavaScript實現動態效果。 5.常見錯誤包括標籤未閉合和屬性值未加引號,需使用驗證工具。 6.優化策略包括減少HTTP請求、壓縮HTML、使用語義化標籤等。

centos和ubuntu的區別 centos和ubuntu的區別 Apr 14, 2025 pm 09:09 PM

CentOS 和 Ubuntu 的關鍵差異在於:起源(CentOS 源自 Red Hat,面向企業;Ubuntu 源自 Debian,面向個人)、包管理(CentOS 使用 yum,注重穩定;Ubuntu 使用 apt,更新頻率高)、支持週期(CentOS 提供 10 年支持,Ubuntu 提供 5 年 LTS 支持)、社區支持(CentOS 側重穩定,Ubuntu 提供廣泛教程和文檔)、用途(CentOS 偏向服務器,Ubuntu 適用於服務器和桌面),其他差異包括安裝精簡度(CentOS 精

laravel和thinkphp的區別 laravel和thinkphp的區別 Apr 18, 2025 pm 01:09 PM

Laravel 和 ThinkPHP 都是流行的 PHP 框架,在開發中各有優缺點。本文將深入比較這兩者,重點介紹它們的架構、特性和性能差異,以幫助開發者根據其特定項目需求做出明智的選擇。

See all articles