HTML での a タグ href='' のいくつかの使用法の紹介

黄舟
リリース: 2017-07-27 13:32:12
オリジナル
6948 人が閲覧しました

ご存知のとおり、a タグの最も重要な機能は、ハイパーリンクとアンカーを実装することです。さらに、ほとんどの人は、a タグの最も重要な役割はハイパーリンクを実装することであると考えています。今日、私はたまたま a タグ の書き方を見つけました。以下に、a タグ内での href の使用例をいくつか示します。

1. Jsのいくつかの呼び出しメソッド(概要を参照)

1.

a href="javascript:j
s_method();"
ログイン後にコピー

これはよく使われるメソッドですが、このメソッドは次のようなパラメータを渡します問題が発生しやすく、a の href 属性として javascript:protocol が使用されていると、不要に window.onbeforeunload イベントが発生するだけでなく、IE での GIF アニメーションの再生が停止してしまいます。 W3C 標準では、href
2 で JavaScript ステートメントを実行することは推奨していません。

 a href="javascript:void(0);" onclick="js_method()"
ログイン後にコピー

このメソッドは、多くの Web サイトで最も一般的に使用されているメソッドであり、最も包括的なメソッドでもあります。onclick メソッドは、js 関数の実行を担当します。 void は演算子であり、 void(0) は未定義を返し、アドレスはジャンプしません。また、このメソッドは最初のメソッドのように js メソッドをブラウザのステータス バーに直接公開しません。
3.

a href="javascript:;" onclick="js_method()"
ログイン後にコピー

このメソッドは 2 つのメソッドに似ていますが、唯一の違いは空の JS コードが実行されることです。
4.

a href="#" onclick="js_method()"
ログイン後にコピー

このメソッドもインターネット上で非常に一般的なコードです # はタグに組み込まれているメソッドであり、top の役割を表します。したがって、このメソッドを使用して Web ページをクリックすると、ページの先頭に戻ります。

5.

a href="#" onclick="js_method();return false;"
ログイン後にコピー

このメソッドは、クリックして js 関数を実行した後に false を返します。ページはジャンプせず、実行後もページの現在位置に留まります。
上記に基づいて、a で js 関数を呼び出す最も適切な方法が推奨されます:



ログイン後にコピー

2. href="#" の役割

href="#" a は一番上に戻ることを意味します。現在のページをスクロールする必要がある場合は、この方法で直接先頭に戻ることができます。たとえば、一部の Web サイトでは、トップに戻るためのアイコン ボタンが右下隅に作成されます。この場合、この最も簡単な方法を使用して実装することを検討できます。

<span style="font-size:14px;"><a href="#">回到最顶端</a></span>
ログイン後にコピー

3. href="URL"の役割

1. この時点では、URLは絶対URLです

href="http://write.blog.csdn.net"
ログイン後にコピー

のように、クリックするとこのリンクのページに直接ジャンプします。

2. URLは相対URLです

このとき、href="/test.doc"などのサイト内のファイルを指しており、クリックするとファイルが直接ダウンロードされます。

3. アンカーURL

このとき、href="#top"などページ内のアンカーを指しており、クリックするとid="top"のアンカーポイントに移動します現在のページで「」を実行し、現在のページを実現する、いわゆるジャンプです。最も一般的な使用法は、スクロール可能なページにメニューを追加して、ページの特定の部分に直接戻ることです。

つまり、3 つのコード サンプルすべて:

<a href="http://baidu.com">超链接</a>
<a href="#">回到最顶端</a>
<a href="css/css1.css">文件链接</a>
ログイン後にコピー

以上がHTML での a タグ href='' のいくつかの使用法の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート