HTML DOM Button name 속성은
구문
다음은 −
의 구문입니다.이름 속성 설정 -
buttonObject.name = name
여기서 name 속성 값은 버튼의 이름을 나타내는 데 사용됩니다.
예시
버튼 이름 속성의 예를 살펴보겠습니다 -
<!DOCTYPE html>
<html>
<body>
<button id="button1" name="btn1">BUTTON</button>
<p>Click the button below and change the above button name.</p>
<button onclick="change()">CHANGE</button>
<p id="Sample"></p>
<script>
function change() {
document.getElementById("button1").name="SECOND BUTTON";
var x=document.getElementById("button1").name;
document.getElementById("Sample").innerHTML="The new button name is "+x;
}
</script>
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -

CHANGE 클릭 시 -

위의 예에서 -
먼저 id가 "button1"이고 이름이 "btn1"인 버튼을 만들었습니다.
<button id="Button1">BUTTON</button>
그런 다음 클릭 시 change() 메서드를 실행하는 CHANGE 버튼을 만들었습니다.
<button onclick="change()">CHANGE</button>
change() 함수는 id가 "button1"인 버튼 요소를 가져와서 name 속성 값을 "SECOND BUTTON"으로 변경합니다. 그런 다음 버튼의 이름 값이 변수 x에 할당되고 마지막으로 id가 "Sample"인 단락에 표시됩니다.
function change() {
document.getElementById("button1").name="SECOND BUTTON";
var x=document.getElementById("button1").name;
document.getElementById("Sample").innerHTML="The new button name is "+x;
}