HTML DOM createElement() 메서드는 JavaScript를 사용하여 HTML 요소를 동적으로 생성하는 데 사용됩니다. 요소 이름을 매개변수로 사용하여 해당 요소 노드를 생성합니다. 새로 생성된 요소를 DOM의 일부로 사용하려면 appendChild() 메서드를 사용해야 합니다.
구문
다음은 createElement() 메소드의 구문입니다 -
document.createElement(nodename)
예시
createElement() 메서드의 예를 살펴보겠습니다. -
<!DOCTYPE html>
<html>
<body>
<h1>createElement() example</h1>
<p>Click the below button to create more buttons</p>
<button onclick="createButton()">CREATE</button>
<br><br>
<script>
var i=0;
function createButton() {
i++;
var btn = document.createElement("BUTTON");
btn.innerHTML="BUTTON"+i;
var br= document.createElement("BR");
document.body.appendChild(btn);
document.body.appendChild(br);
}
</script>
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -
CREATE 버튼을 세 번 클릭하면. 하나의 버튼에 대한 한 번의 클릭 -
위의 예에서 -
사용자가 클릭하면 createButton() 메서드를 실행하는 CREATE 버튼을 만들었습니다.
<button onclick="createButton()">CREATE</button>
createButton() 함수는 문서 객체의 createElement() 메소드를 사용하여
var i=0;
function createButton() {
i++;
var btn = document.createElement("BUTTON");
btn.innerHTML="BUTTON"+i;
var br= document.createElement("BR");
document.body.appendChild(btn);
document.body.appendChild(br);
}