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

HTMLDOMベースオブジェクト

HTML DOM Baseオブジェクトは、HTMLの要素に関連付けられています。 要素は、HTMLドキュメント内の他のすべてのURLのベースURLを指定するために使用されます。 HTMLドキュメントには最大で1つの要素を含めることができます。 Baseオブジェクトは、要素のhref属性を設定または取得するために使用されます。

プロパティ

以下は、Baseオブジェクトのプロパティです-

プロパティ 説明
href 基本要素のhref属性の値を設定または返します
ターゲット 基本要素のターゲット属性の値を設定または返します

構文

以下は、-

の構文です。

基本要素の作成-

document.createElement ("base")

基本要素へのアクセス-

var a = document.getElementById("demoBase");

例

ベースオブジェクトの例を見てみましょう-

<!DOCTYPE html>
<html>
<body>
<p>Create the element first and then access it</p>
<p>Click the button below to create or access BASE element.</p>
<button onclick="CreateBase()">CREATE</button>
<button onclick="AcessBase()">ACCESS</button>
<p id="SAMPLE"></p>
<script>
   function CreateBase() {
      var x = document.createElement("BASE");
      x.setAttribute("id","myBase");
      x.setAttribute("href", "https://www.google.com");
      document.head.appendChild(x);
      document.getElementById("SAMPLE").innerHTML = "BASE element with href
      https://www.google.com is created";
   }
   function AcessBase() {
      var x = document.getElementById("myBase").href;
      document.getElementById("SAMPLE").innerHTML = x;
   }
</script>
</body>
</html>

出力

これにより、次の出力が生成されます-

HTMLDOMベースオブジェクト

[作成]-

をクリックすると

HTMLDOMベースオブジェクト

アクセスをクリックすると-

HTMLDOMベースオブジェクト

上記の例では-

CreateBase（）関数とAccessBase（）関数をそれぞれ実行するために、CREATEとACCESSの2つのボタンを作成しました。

<button onclick="CreateBase()">CREATE</button>
<button onclick="AcessBase()">ACCESS</button>

CreateBase（）関数は、基本要素を作成し、それを変数xに割り当てます。次に、setAttribute（）メソッドを使用して、そのidとhrefを設定します。次に、新しく作成された基本要素が、appendChild（）プロパティを使用してドキュメントヘッドに追加されます。最後に、ベース作成メッセージが、IDSAMPLEが関連付けられた段落に表示されます。

function CreateBase() {
   var x = document.createElement("BASE");
   x.setAttribute("id","myBase");
   x.setAttribute("href", "https://www.google.com");
   document.head.appendChild(x);
   document.getElementById("SAMPLE").innerHTML = "BASE element with href https://www.google.com is created";
}

AcessBase（）関数は、新しく作成された要素にアクセスするために作成されます。これは、要素をidで取得し、そのhref値を取得して、xという名前の変数に割り当てることで実現します。 xの情報は、IDSAMPLEの段落に表示されます。

function AcessBase() {
   var x = document.getElementById("myBase").href;
   document.getElementById("SAMPLE").innerHTML = x;
}

  1. HTMLDOMオブジェクトオブジェクト

    HTMLのHTMLDOMオブジェクトオブジェクトは、 を表します 要素。 要素の作成 var objectElement = document.createElement(“OBJECT”) ここでは、「 objectElement 」は次のプロパティを持つことができます- プロパティ 説明 データ objectelementによって使用されているリソースのURLを設定/返します フォーム オブジェクト要素の囲み形式への参照を返します 高さ オブジェクト要素の高さを設定/返します 名前 オブジェクト要素の

  2. HTMLDOMUlオブジェクト

    HTMLのHTMLDOMUlオブジェクトは、 を表します 要素。 を作成する 要素 var ulObject = document.createElement(“UL”) ここでは、「ulObject」 次のプロパティを持つことができますが、 HTML5ではサポートされていません − プロパティ 説明 コンパクト 順不同リストを通常より小さく表示するかどうかを設定/返します タイプ 順序付けされていないリストのtype属性の値を設定/返します 順不同リストの例を見てみましょう 要素- 例 <!DOCTYPE