HTML DOM Button autofocus 속성은
구문
다음은 −
의 구문입니다.버튼 자동 초점 속성 설정 -
buttonObject.autofocus = true|false
여기에서 true|false는 주어진 입력 버튼이 페이지가 로드될 때가 아니라 포커스를 받아야 하는지 여부를 지정합니다.
- 사실 − 입력 버튼이 포커스를 얻습니다.
- 거짓 - 입력 버튼에 초점이 맞지 않습니다.
예시
HTML DOM 버튼 자동 초점 속성에 대한 예를 살펴보겠습니다 -
<!DOCTYPE html>
<html>
<body>
<button type="button" id="MyButton" autofocus>BUTTON</button>
<p>Click the below button to know if the input button above automatically gets the focus on page load or not</p>
<button onclick="buttonFocus()">CLICK IT</button>
<p id="Sample"></p>
<script>
function buttonFocus() {
var x = document.getElementById("MyButton").autofocus;
if(x==true)
document.getElementById("Sample").innerHTML="The input button does get focus on page load";
else
document.getElementById("Sample").innerHTML="The input button does not get focus on
page load";
}
</script>
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -
CLICK IT 버튼을 클릭하면 -
위의 예에서 -
id가 "MyButton"이고 자동 초점 속성이 활성화된 버튼이 있습니다. −
<button type="button" id="MyButton" autofocus>BUTTON</button>
그런 다음 buttonFocus() 기능을 실행하기 위한 CLICK IT 버튼이 있습니다 -
<button onclick="buttonFocus()">CLICK IT</button>
buttonFocus() 함수는 getElementById() 메서드를 사용하여 버튼 요소를 가져오고 자동 초점 값(Boolean)을 가져와 변수 x에 할당합니다. 조건문을 사용하여 자동 초점 값이 true 및 false인지 확인하고 이에 따라 ID가 "Sample"인
요소에 적절한 텍스트를 표시합니다.
function buttonFocus() {
var x = document.getElementById("MyButton").autofocus;
if(x==true)
document.getElementById("Sample").innerHTML="The input button does get focus on page load";
else
document.getElementById("Sample").innerHTML="The input button does not get focus on page load";
}