HTML DOM cloneNode（）メソッド
HTML DOM cloneNode（）メソッドは、cloneNode（）メソッドが呼び出される特定のノードのコピーを作成するために使用され、クローンを返します。 cloneNode（）メソッドは、指定されたノードのすべての属性と値を複製します。
構文
以下はcloneNode（）メソッドの構文です-
yourNode.cloneNode([deep])
ここで、deepはオプションのパラメーターです。その値をtrueに設定することにより、指定されたノードとその子、およびそれらの属性と値を複製する必要があることを指定し、その値をfalseに設定することにより、指定されたノードとその属性と値のみをコピーし、その子ノードはコピーしないことを指定します。 。
例
HTML DOM cloneNode（）メソッドの例を見てみましょう-
<!DOCTYPE html>
<html>
<head>
<title>CLONE NODE</title>
<style>
h1{color:green;}
h2{ color:blue; }
</style>
</head>
<body>
<div id="DIV1">
<h1> HEADING 1</h1>
<h2> HEADING 2</h2>
</div>
<button onclick="CloneEle()"> CLONE </button>
<script>
function CloneEle() {
var x= document.getElementById("DIV1");
var clone = x.cloneNode(true);
document.body.appendChild(clone);
}
</script>
</body>
</html> 出力
これにより、次の出力が生成されます-
クローンボタンをクリックすると-
上記の例では-
divを作成し、その中に
次に、ユーザーがクリックしたときに関数CloneEle（）を実行するボタンCLONEを作成しました-
CloneEle（）メソッドは、getElementById（）メソッドを使用してdiv要素を取得し、それを変数xに割り当てます。次に、パラメーターtrueを指定して
HTML DOM hasAttributes（）メソッドは、要素に属性があるかどうかをチェックします。要素に属性が含まれている場合はtrueを返し、含まない場合はfalseを返します。このメソッドが要素ノード以外のノードで呼び出された場合、戻り値は常にfalseになります。 構文 以下は、hasAttribbutes（）メソッドの構文です- node.hasAttributes() 例 hasAttributes（）メソッドの例を見てみましょう- <!DOCTYPE html>
<html>
<body>
<h1>hasAttributes(
HTML DOM focus（）メソッドは、HTML要素にフォーカスを与えるために使用されます。フォーカスをすべてのHTML要素に適用することはできません。例：タグにフォーカスすることはできません。要素からフォーカスを削除するには、blur（）メソッドを使用します。 構文 以下は構文です- HTMLElementObject.focus() 例 focus（）メソッドの例を見てみましょう- <!DOCTYPE html>
<html>
<head>
<style>
input[type=text]:focus, p: h1{color:green;}
h2{ color:blue; }
<div id="DIV1">
<h1> HEADING 1</h1>
<h2> HEADING 2</h2>
</div> <button onclick="CloneEle()"> CLONE </button>
function CloneEle() {
var x= document.getElementById("DIV1");
var clone = x.cloneNode(true);
document.body.appendChild(clone);
}