HTML DOM パラメータオブジェクトとは？作成方法とプロパティを解説
HTML DOM のパラメータオブジェクト（Parameter Object）は、HTMLドキュメント内の <param> 要素を表すオブジェクトです。<param> 要素は、<object> 要素や <embed> 要素などの埋め込みコンテンツに対して、実行時のパラメータを渡すために使用されます。
paramオブジェクトの作成方法
構文
paramオブジェクトを作成するには、以下のように document.createElement() メソッドを使用します。
document.createElement("PARAM");paramオブジェクトの主なプロパティ
paramオブジェクトには、以下の2つの主要なプロパティがあります。
| プロパティ | 説明 |
|---|---|
| name | HTMLドキュメント内の param 要素の name 属性の値を取得・変更します。 |
| value | HTMLドキュメント内の param 要素の value 属性の値を取得・変更します。 |
サンプルコード
ここでは、実際に param オブジェクトを動的に作成する例を見てみましょう。ボタンをクリックすると、<object> 要素とその子要素として <param> 要素が生成されます。
<!DOCTYPE html>
<html>
<head>
<style>
html{
height:100%;
}
body{
text-align:center;
color:#fff;
background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
height:100%;
}
.btn{
background:#0197F6;
border:none;
height:2rem;
border-radius:2px;
width:60%;
margin:2rem auto;
display:block;
color:#fff;
outline:none;
cursor:pointer;
}
</style>
</head>
<body>
<h1>DOM Parameter Object Demo</h1>
<button onclick="create()" class="btn">Create a Param element</button>
<script>
function create() {
var objectElement = document.createElement("OBJECT");
objectElement.setAttribute("data", "https://www.tutorialspoint.com/html/Kalimba.mp3");
objectElement.setAttribute("class", "object-element");
document.body.appendChild(objectElement);
var paramObject = document.createElement("PARAM");
paramObject.setAttribute("name", "autoplay");
paramObject.setAttribute("value", "true");
document.querySelector(".object-element").appendChild(paramObject);
}
</script>
</body>
</html>実行結果
上記のコードを実行すると、次のような画面が表示されます。
「Create a Param element」ボタンをクリックすると、JavaScriptによって <object> 要素が生成され、さらにその中に name 属性が「autoplay」、value 属性が「true」に設定された <param> 要素が追加されます。
まとめ
このように、document.createElement("PARAM") を使うことで、JavaScriptから動的に <param> 要素を生成し、name プロパティと value プロパティを使ってパラメータ情報を設定できます。埋め込みメディアの動作（自動再生など）を制御したい場合に活用できるテクニックです。
-
HTML DOM Titleオブジェクトとは？textプロパティの使い方をわかりやすく解説
HTML DOM Titleオブジェクトの概要HTML DOM の Title オブジェクトは、HTML ドキュメント内の <title> 要素を表すオブジェクトです。このオブジェクトを利用することで、JavaScript からページのタイトルを動的に取得したり変更したりすることが可能になります。<title> 要素の作成方法新しい <title> 要素を作成するには、document.createElement() メソッドを使用します。var titleObject = document.createElement(TITLE)ここで作成した「title
-
HTML DOM Ulオブジェクトとは？<ul>要素の操作方法とサンプルコードを解説
HTML DOM の Ul オブジェクトは、HTML の <ul>（順序なしリスト）要素を表すオブジェクトです。JavaScript を使うことで、リストの動的な生成や操作が可能になります。 <ul> 要素の作成方法 新しい <ul> 要素を作成するには、document.createElement() メソッドを使用します。 var ulObject = document.createElement(UL) HTML5で非推奨となったプロパティ ulObject には以下のプロパティが存在しますが、これらは HTML5 ではサポートされていないため注