suchen
HeimWeb-FrontendHTML-Tutorial超链接的那些事(二): 属性href_html/css_WEB-ITnose

a标签的属性之一 href

1. 定义

    href 属性用于指定超链接目标的 URL。

2. 用法

    ①. 锚点

  • 同一页面添加锚点
  •         (1)连接到本页面的锚的超链接   //点击的连接

            (2)   //放到要跳转内容的地方

  • 跨页面添加锚点
  •         (1)在test2.html创建锚

            (2)在test1.html设置好连接连接到另外页面的锚的超链接

        ②. 下载

    <a href="download.rar"></a> 

         href中的url需要有效,文件最好是rar格式

        ③. 打电话

    <a href="tel:电话号码"></a>

      ④. 邮箱

        邮箱标签: mailto 

        属     性: cc: 抄送

                      bcc: 暗抄

                      subject:主题

                      body:邮箱内容

  • 常规  
  •              

  • 利用逗号(,) 多地址发送
  •           

  • 利用属性
  •           

      ⑤. Javascript

  • 直接调用javascript
  •          

       W3C标准不推荐在href里面执行javascript语句.这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。

  • 使用void, ::, undefined, 配合onclick
  •          

             

             

              最常用的方法,也是最周全的方法,地址不发生跳转,不会在地址栏暴露Js方法

  •  '#'和onclick
  •           

              '#'是标签内置的一个方法,代表top的作用,所以执行方法后返回页面最顶端。

             

               执行'return false'后,页面不发生跳转,页面停留在当前位置。

    未完待续....

    Stellungnahme
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Was ist der Zweck des & lt; Fortschritts & gt; Element?Was ist der Zweck des & lt; Fortschritts & gt; Element?Mar 21, 2025 pm 12:34 PM

    Der Artikel erörtert den HTML & lt; Progress & gt; Element, Absicht, Styling und Unterschiede vom & lt; Meter & gt; Element. Das Hauptaugenmerk liegt auf der Verwendung & lt; Fortschritt & gt; Für Aufgabenabschluss und & lt; Meter & gt; für stati

    Was ist der Zweck des & lt; datalist & gt; Element?Was ist der Zweck des & lt; datalist & gt; Element?Mar 21, 2025 pm 12:33 PM

    Der Artikel erörtert den HTML & lt; Datalist & gt; Element, das die Formulare verbessert, indem automatische Vorschläge bereitgestellt, die Benutzererfahrung verbessert und Fehler reduziert werden.Character Count: 159

    Was ist der Zweck des & lt; Meter & gt; Element?Was ist der Zweck des & lt; Meter & gt; Element?Mar 21, 2025 pm 12:35 PM

    Der Artikel erörtert das HTML & lt; Meter & gt; Element, verwendet zur Anzeige von Skalar- oder Bruchwerten innerhalb eines Bereichs und seine gemeinsamen Anwendungen in der Webentwicklung. Es differenziert & lt; Meter & gt; von & lt; Fortschritt & gt; und Ex

    Was ist das Ansichtsfenster -Meta -Tag? Warum ist es wichtig für reaktionsschnelles Design?Was ist das Ansichtsfenster -Meta -Tag? Warum ist es wichtig für reaktionsschnelles Design?Mar 20, 2025 pm 05:56 PM

    In dem Artikel wird das Ansichtsfenster -Meta -Tag erörtert, das für das reaktionsschnelle Webdesign auf mobilen Geräten unerlässlich ist. Es wird erläutert, wie die ordnungsgemäße Verwendung eine optimale Skalierung von Inhalten und Benutzerinteraktion gewährleistet, während Missbrauch zu Design- und Zugänglichkeitsproblemen führen kann.

    Was sind die besten Praktiken für die Kompatibilität des Cross-Browsers in HTML5?Was sind die besten Praktiken für die Kompatibilität des Cross-Browsers in HTML5?Mar 17, 2025 pm 12:20 PM

    In Artikel werden Best Practices zur Gewährleistung der HTML5-Cross-Browser-Kompatibilität erörtert und sich auf die Erkennung von Merkmalen, die progressive Verbesserung und die Testmethoden konzentriert.

    Wie verwende ich HTML5 -Formularvalidierungsattribute, um die Benutzereingabe zu validieren?Wie verwende ich HTML5 -Formularvalidierungsattribute, um die Benutzereingabe zu validieren?Mar 17, 2025 pm 12:27 PM

    In dem Artikel werden unter Verwendung von HTML5 -Formularvalidierungsattributen wie Erforderlich, Muster, Min, MAX und Längengrenzen erörtert, um die Benutzereingabe direkt im Browser zu validieren.

    Wie benutze ich die HTML5 & lt; Zeit & gt; Element, um Daten und Zeiten semantisch darzustellen?Wie benutze ich die HTML5 & lt; Zeit & gt; Element, um Daten und Zeiten semantisch darzustellen?Mar 12, 2025 pm 04:05 PM

    Dieser Artikel erklärt den HTML5 & lt; Time & gt; Element für semantische Datum/Uhrzeit. Es betont die Wichtigkeit des DateTime-Attributs für die Maschinenlesbarkeit (ISO 8601-Format) neben menschenlesbarem Text, das Zubehör steigert

    Was ist der Zweck des & lt; iframe & gt; Etikett? Was sind die Sicherheitsüberlegungen bei der Verwendung?Was ist der Zweck des & lt; iframe & gt; Etikett? Was sind die Sicherheitsüberlegungen bei der Verwendung?Mar 20, 2025 pm 06:05 PM

    Der Artikel erörtert das & lt; iframe & gt; Der Zweck von Tag, externe Inhalte in Webseiten, seine gemeinsamen Verwendungen, Sicherheitsrisiken und Alternativen wie Objekt -Tags und APIs einzubetten.

    See all articles

    Heiße KI -Werkzeuge

    Undresser.AI Undress

    Undresser.AI Undress

    KI-gestützte App zum Erstellen realistischer Aktfotos

    AI Clothes Remover

    AI Clothes Remover

    Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

    Undress AI Tool

    Undress AI Tool

    Ausziehbilder kostenlos

    Clothoff.io

    Clothoff.io

    KI-Kleiderentferner

    AI Hentai Generator

    AI Hentai Generator

    Erstellen Sie kostenlos Ai Hentai.

    Heiße Werkzeuge

    MinGW – Minimalistisches GNU für Windows

    MinGW – Minimalistisches GNU für Windows

    Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

    SublimeText3 Englische Version

    SublimeText3 Englische Version

    Empfohlen: Win-Version, unterstützt Code-Eingabeaufforderungen!

    EditPlus chinesische Crack-Version

    EditPlus chinesische Crack-Version

    Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion

    VSCode Windows 64-Bit-Download

    VSCode Windows 64-Bit-Download

    Ein kostenloser und leistungsstarker IDE-Editor von Microsoft

    ZendStudio 13.5.1 Mac

    ZendStudio 13.5.1 Mac

    Leistungsstarke integrierte PHP-Entwicklungsumgebung