ジャバスクリプト：<A>元素

原文章：https://wangdoc.com/javascript/index.html

<a> 要素

<a>要素は、リンクを設定するために使用されます。共通インタフェース（ページ要素に加えて、NodeインターフェースElementのインターフェース、HTMLElementインターフェース）は、継承HTMLAnchorElementインターフェイスとHTMLHyperlinkElementUtilsインターフェイスを。

プロパティ

URL関連のプロパティ

<a>リンクアドレスを動作させるために使用することができURL属性に関連する一連の要素があります。これらの属性の意味は、参照することができLocation、オブジェクトのインスタンス属性。

• ハッシュ：（でセグメント識別子#開始）
• ホスト：ホストとポート（デフォルトポート80と443を省略する）
• ホスト名：ホスト名
• HREF：フルURL
• 原産地：プロトコル、ドメイン名とポート
• パスワード：ホスト名の前にパスワード
• パス名：パス（の/始まり）
• ポート：ポート
• プロトコル：プロトコル（含む後続の結腸:）
• 検索：クエリ文字列（する?で始まります）
• ユーザー名：ユーザー名、ホスト名の前に

// HTML 代码如下
// <a id="test" href="http://user:[email protected]:8081/index.html?bar=1#foo">test</a>
var a = document.getElementById('test');
a.hash // "#foo"
a.host // "example.com:8081"
a.hostname // "example.com"
a.href // "http://user:[email protected]:8081/index.html?bar=1#foo"
a.origin // "http://example.com:8081"
a.password // "passwd"
a.pathname // "/index.html"
a.port // "8081"
a.protocol // "http:"
a.search // "?bar=1"
a.username // "user"

加えて、origin属性は読み取り専用で、上記のプロパティは読み書き可能です。

アクセスキープロパティ

accessKeyプロパティは読み取りおよび書き込みするために使用される<a>重要な要素のショートカット。

// HTML 代码如下
// <a id="test" href="http://example.com">test</a>
var a = document.getElementById('test');
a.accessKey = 'k';

上記のコードは設定<a>要素のショートカットキーをk、ショートカットキーを押すだけの後、ブラウザがにジャンプしますexample.com。

異なるオペレーティングシステム上の異なるブラウザは、ファンクションキーのショートカットキーの組み合わせを呼び起こすことに注意があると同じではありません。例えば、Linuxシステム上のChromeブラウザは、あなたがプレスに必要なAlt + k、にジャンプしますexample.com。

ダウンロードのプロパティ

download属性は、現在のリンクを参照するために使用されるが、ダウンロードにいないことを示します。その値は、ダウンロードしたユーザのファイル名を表す文字列です。

// HTML 代码如下
// <a id="test" href="foo.jpg">下载</a>
var a = document.getElementById('test');
a.download = 'bar.jpg';

上記のコード、<a>要素は、画像リンク、デフォルトでは、画像上のクリックは現在のウィンドウにロードされますです。セットアップdownloadプロパティの後に、その後、このリンクをクリックして、彼らは場所を保存するかどうかをユーザに尋ねるダイアログボックスをダウンロードして、指定されたファイルをダウンロードしますbar.jpg。

HREFLANG属性

hreflangプロパティは読み取りおよび書き込みするために使用される<a>HTML属性の要素をhreflangのようなリソースへのリンクの言語を示しますhreflang="en"。

// HTML 代码如下
// <a id="test" href="https://example.com" hreflang="en">test</a>
var a = document.getElementById('test');
a.hreflang // "en"

referrerPolicyプロパティ

referrerPolicyプロパティは読み取りおよび書き込みするために使用される<a>HTML属性の要素をreferrerPolicyユーザーがHTTPヘッダに情報を送信する方法、リンクをクリックしたときに指定し、refererフィールド。

HTTPヘッダ情報refererフィールドは、現在の要求から来た示します。それはでフォーマットすることができる<a>要素referrerPolicy指定されたプロパティ、選択することができる3つの値が存在します。

• no-referrer：Doが送信されませrefererフィールドを。
• origin：refererフィールドの値は、<a>要素のorigin属性、すなわち、プロトコル名+ホスト+ポート。
• unsafe-url：refererフィールドの値があるoriginプロパティに加えて、パスが、含まれていない#フラグメントを。この形式の情報は、最も詳細な情報を提供し、情報漏洩のリスクがあるかもしれません。

// HTML 代码如下
// <a id="test" href="https://example.com" referrerpolicy="no-referrer">test</a>
var a = document.getElementById('test');
a.referrerPolicy // "no-referrer"

rel属性

relプロパティは、読み取りと書き込みのために使用される<a>HTML属性の要素rel、ショー現在のドキュメントへのリンクとの間の関係。

// HTML 代码如下
// <a id="test" href="https://example.com" rel="license">license.html</a>
var a = document.getElementById('test');
a.rel // "license"

tabIndexプロパティ

tabIndex属性値は、現在の読み書きのために、整数である<a>タブキートラバーサル順序内で文書内の要素を。

// HTML 代码如下
// <a id="test" href="https://example.com">test</a>
var a = document.getElementById('test');
a.tabIndex // 0

targetプロパティ

targetプロパティは読み取りおよび書き込みするために使用される<a>HTML属性の要素をtarget。

// HTML 代码如下
// <a id="test" href="https://example.com" target="_blank">test</a>
var a = document.getElementById('test');
a.target // "_blank"

テキスト属性

textプロパティは、読み取りおよび書き込みするために使用される<a>リンクテキストの要素は、現在のノードに等しいtextContent属性。

// HTML 代码如下
// <a id="test" href="https://example.com">test</a>
var a = document.getElementById('test');
a.text // "test"

タイププロパティ

typeプロパティは読み取りおよび書き込みするために使用される<a>HTML属性の要素をtypeリンク先のMIMEタイプを示します。

// HTML 代码如下
// <a id="test" type="video/mp4" href="example.mp4">video</a>
var a = document.getElementById('test');
a.type // "video/mp4"

方法

<a>要素法は、主に以下の三つで、継承されています。

• blur()：現在の要素から削除し、キーボードフォーカスは、参照HTMLElementプレゼンテーションインタフェースを。
• focus()：キーボードフォーカス、詳細取得する現在の要素HTMLElementインターフェースの記述を。
• toString()：現在の戻り値<a>の要素のHTML属性をhref。