HTMLはa要素hrefのURLリンクを自動的に更新したり新しいウィンドウを開いたりする機能を実装する

場合によっては、次のような機能を実装したいことがあります。リンクをクリックします。リンクがブラウザで開かれている場合は、開いているリンク ウィンドウを更新します。リンクが開かれていない場合は、リンク ページを新しいウィンドウで開きます。

これは、ブラウザのタブで重複したページや冗長なページが開かれることを効果的に回避できる、非常に優れたエクスペリエンス向上機能です。

鍵はそれをどうやって達成するかです。

a タグの target 属性を使用します。

リンク要素とフォーム要素の両方に target という属性があります。サポートされている値は次のとおりです。

• _self: デフォルト値。現在のブラウザのコンテキスト。
• _blank: 通常は新しいタブですが、ユーザーはブラウザを設定して新しいウィンドウで開くこともできます。
• _parent: 現在のブラウザ コンテキストの親コンテキスト。親が存在しない場合は、_self のように動作します。
• _top: 最上位のブラウザコンテキスト。祖先コンテキストが存在しない場合は、_self のように動作します。

実際、ターゲットには、特定の URL アドレスまたは任意のカスタム名として指定できるという隠れた機能があります。

例えば：

<a href="http://www.baidu.com" target="http://www.baidu.com">空白ページ</a>

このとき、ブラウザに既に blank.html というアドレスのタブがある場合、上記のリンクをクリックしても新しいウィンドウは開かず、既に開いている blank.html が直接更新されます。ブラウザに blank.html というアドレスのタブがない場合、target 属性の動作は '_blank' と同様になります。

つまり、リンク アドレスの自動更新と新しいウィンドウの開きという要件を実現したい場合は、リンク要素とフォーム要素の target 属性値をターゲット URL アドレス値に設定するだけで済みます。

したがって、すべての検索結果ページで 1 つのタブを使用する場合は、他の方法を使用する必要があります。これは非常に簡単です。同じ値を指定するだけです。たとえば、次のようになります。

<a href="blank.html?s=1" target="_search">空白ページ?s=1</a>
<a href="blank.html?s=2" target="_search">空白ページ?s=2</a>

ご覧のとおり、 href="blank.html?s=1"和href="blank.html?s=2"同じページを指し、2 つの新しいウィンドウは開きません。

要約する

a 要素の href リンクを自動的に更新したり、新しいウィンドウで開く機能を実現するには、target 属性値を href 属性値と同じに設定するだけです。

この機能はIE、Firefox、Chromeでサポートされているので、安心してご利用いただけます。

html 内の要素 href の URL リンクの自動更新または新しいウィンドウを開く方法についての記事はこれで終わりです。html 内の URL リンクの自動更新または新しいウィンドウを開く方法についてのより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。