HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML DOMのdomainプロパティとは?使い方とサンプルコードを解説

HTML DOM の domain プロパティは、現在ドキュメントが実行されているサーバーのドメイン名を取得するためのプロパティです。取得したドメイン名は文字列として返され、ドメインが識別できない場合には null が返されることもあります。

構文

domain プロパティの基本的な構文は以下の通りです。

document.domain

使用例

ここで、HTML DOM の domain プロパティを使用した具体的なサンプルコードを見てみましょう。

<!DOCTYPE html>
<html>
<body>
<h1>domain プロパティの例</h1>
<p>下のボタンをクリックすると、ドメイン名の値を取得できます</p>
<button onclick="getDomain()">ドメインを取得</button>
<p id="Sample"></p>
<script>
    function getDomain() {
        var doc = document.domain;
        document.getElementById("Sample").innerHTML =
        "このドキュメントを実行しているサーバーのドメイン名は " + doc + " です";
    }
</script>
</body>
</html>

出力結果

上記のコードを実行すると、次のような画面が表示されます。

HTML DOMのdomainプロパティとは?使い方とサンプルコードを解説

「ドメインを取得」ボタンをクリックすると、以下のようにドメイン名が表示されます。

HTML DOMのdomainプロパティとは?使い方とサンプルコードを解説

コードの解説

まず、「ドメインを取得」ボタンを作成します。このボタンは、ユーザーがクリックしたときに getDomain() 関数を実行するように設定されています。

<button onclick="getDomain()">ドメインを取得</button>

getDomain() 関数内では、document の domain プロパティの値を取得し、変数 doc に代入しています。その後、id が「Sample」に設定された段落要素に対して innerHTML プロパティを使用し、目的のテキストを画面に表示します。

function getDomain() {
    var doc = document.domain;
    document.getElementById("Sample").innerHTML =
    "このドキュメントを実行しているサーバーのドメイン名は " + doc + " です";
}

注意点

domain プロパティは読み取りだけでなく設定も可能ですが、これは同一生成元ポリシー(Same-Origin Policy)を緩和するための仕組みです。ただし、セキュリティ上のリスクを伴うため、特別な理由がない限り値を変更しないことが推奨されています。通常は、現在のページのドメイン名を確認したい場合に読み取り専用として利用するのが安全です。

  1. HTML DOMのdoctypeプロパティとは?構文と使い方をわかりやすく解説

    HTML DOMのdoctypeプロパティは、現在のHTML文書に関連付けられているDTD(Document Type Declaration:文書型宣言)を返します。このプロパティは読み取り専用であり、文書型の名前をDocumentTypeオブジェクトとして取得します。なお、対象の文書にDTDが指定されていない場合は、nullが返されます。 構文 doctypeプロパティの基本構文は以下のとおりです。 document.doctype サンプルコード それでは、doctypeプロパティを使用した具体例を見ていきましょう。 <!DOCTYPE html> <html>

  2. HTML DOM designModeプロパティの使い方を徹底解説

    HTML DOMのdesignModeプロパティを使用すると、ドキュメント全体が編集可能かどうかを指定できます。このプロパティを活用することで、HTMLドキュメントはWYSIWYG(What You See Is What You Get:見たままが得られる)エディターのように動作し、ブラウザ上で直接HTMLドキュメントを編集できるようになります。designModeプロパティのデフォルト値は「off」に設定されており、これを「on」に変更することで、ドキュメントの編集が可能になります。構文designModeプロパティを設定する際の構文は以下の通りです。document.designMode