タグのhref属性とonclickイベントの使用例

タグのhref属性とonclickイベントの使用例

a タグは主にページ ジャンプを実装するために使用され、これは href 属性または onclick イベントを通じて実現できます。

コードをコピー
コードは次のとおりです。

<a onclick="window.location.href='www.jb51.net'" href="javascript:void(0);">123WORDPRESS.COM</a>

このコードは主流のブラウザでは正常に動作しますが、IE6 では動作しません。その理由は何でしょうか?

コードをコピー
コードは次のとおりです。

javascript:void(0);

void(arg); は常に null を返す関数として理解できますが、そのパラメーターは空にできません。パラメータには任意の式や関数を使用できます。

コードをコピー
コードは次のとおりです。

<a href="javascript:void(name = '123WORDPRESS.COM'); alert(name);">テスト</a>

テスト

IE6 はまず onclick などの DOM 自体にバインドされたイベントを実行します。バブリングが防止されていない場合は、href 属性が順番に実行されます。また、void(0); はイベントを実行する必要がないため、IE6 はブラウザーにイベントを実行しないように指示し (前のアクションを上書きします)、バブリングを終了することは return false; と同等であるため、ブラウザーはアクションを実行しません。したがって、onclick イベント内でのバブリング イベントを防止するだけです。

コードをコピー
コードは次のとおりです。

<a onclick="window.location.href='https://www.jb51.net';return false;" href="javascript:void(0);">123WORDPRESS.COM</a>

これは IE6 でも正常に実行されます。

もう 1 つの方法は、javascript:void(0); の代わりに # を使用することです。href 属性の # は、もともとアンカー #name を意味するため、アンカーが指定されていない場合は、ページの先頭に移動します。 # には特定の意味があります。デフォルトは #top です。# の後に内容がある場合はタグとみなし、ページ上で該当するタグを見つけてその場所へジャンプします。見つからない場合はページの先頭へジャンプします。ジャンプしたくない場合は ### を使用できます。### は意味のないタグ指定です。

<<:  Vue でバイナリ ファイル ストリームを受信して​​ PDF プレビューを実現する方法

>>:  CSS ボックスモデル内のパディングと略語の詳細な説明

推薦する

デザイン理論:計画、リソース、コミュニケーションの問題について

<br />多くの中小企業ではこの問題は発生しません。中小企業はデザイナーをサポートし、...

HTMLはキャンバスを使用して箇条書きスクリーン機能を実装します

導入最近、大きな課題をこなす際に、弾幕プレイヤーを作る必要がありました。他の人のソースコードを借りて...

Docker チュートリアル: コンテナの使用 (簡単な例)

Docker を初めて使用する場合は、コンテナの管理を始めるために習得する必要がある基本的なコマン...

EXPLAIN を使って MySQL の SQL 実行プランを分析する方法

序文MySQL では、EXPLAIN コマンドを使用して、テーブルの接続方法や SELECT ステー...

Linux deb パッケージの解凍、変更、その他の操作方法のコード例

さまざまな理由により、debパッケージ内のさまざまなファイルの内容を直接変更する必要がある場合があり...

Ubuntu 20.04にvncserverをインストールする方法

Ubuntu 20.04は2020年4月に正式にリリースされました。本日、ミラーシステムを正式にイン...

Dockerコンテナ内で2つのプロセスを開始するときのDockerfile実装コード

最近、cronスケジュールタスク用のdockerを作りたいと思っており、Dockerfileで次のよ...

JavaScript はマウスのドラッグを実装して div のサイズを調整します

この記事では、マウスをドラッグしてdivのサイズを調整するJavaScriptの具体的なコードを参考...

Zabbix Agent2を使用してOracleデータベースを監視する方法

概要zabbix バージョン 5.0 以降では、zabbix-agent2 という新しい機能が追加さ...

ウェブフロントエンド開発の細部

1 選択タグは閉じられている必要があります <select></select>...

MySQL テーブル構造を Excel にエクスポートする方法

要件は次のとおりですテーブル構造、フィールドコメント情報、テーブル名などをエクスポートします。これは...

JavaScript 状態コンテナ Redux の詳細な説明

目次1. Reduxを選ぶ理由2. Reduxデータフロー3つの原則4. Reduxソースコード分析...

Vue.js パフォーマンス最適化 N 個のヒント (収集する価値あり)

目次機能コンポーネント子コンポーネントの分割ローカル変数v-show によるDOMの再利用キープアラ...

Linuxカーネルの浮動小数点演算のサポートに関する簡単な説明

現在、ほとんどの CPU は浮動小数点ユニット (FPU) をサポートしています。FPU は、プロセ...

JavaScript が Jingdong のカルーセル効果を模倣

この記事では、JD.comのカルーセル効果の表示を実現するためのJavaScriptの具体的なコード...