목차
click() 예제 - 마우스오버 시 클릭 이벤트 발생
click() 정의
click() 구문
click() 예제 - 클릭메서드 이용해 배경색 자동 변경
click() 예제 - 마우스오버 시 클릭 이벤트 발생
<form>
<input type="checkbox" id="hz" onmouseover="homzzang()" onclick="alert('Homzzang.com')">
</form>
<script>
function homzzang() {
document.getElementById("hz").click();
}
</script>
결과보기
click() 정의
요소를 직접 클릭한 것과 같은 효과 주기.
1.
사용자가 해당 요소를 수동으로 클릭한 것과 같은 동작 수행.
JavaScript DOM API의 일부.
HTML 요소에 대한 참조 사용해 작동.
모든 HTML 요소에서 사용 가능.
보통, (버튼/링크/체크박스) 등 사용자입력요소에서 사용.
2. 주의사항
click() 메서드는 모든 HTML 요소에서 사용할 수 있지만, 일부 브라우저에서는 일부 요소에서 작동하지 않을 수 있음. (예) disabled 속성이 설정된 버튼은 click() 메서드로 클릭할 수 없음.
click() 메서드를 사용할 때, 클릭 이벤트가 발생하므로, 클릭 이벤트 핸들러도 호출됨. 이는 일부 예기치 않은 동작을 유발할 수 있으므로 주의 필요.
일부 브라우저에서는 click() 메서드가 일부 보안 정책에 의해 차단될 수 있음. 이러한 경우 사용자의 직접 클릭을 요구할 수 있음.
3.
모든 브라우저 지원.
4.
MDN click() 예제 보기
click() 구문
HTMLElementObject .click()
[매개변수]
없음.
[반환값]
없음.
click() 예제 - 클릭메서드 이용해 배경색 자동 변경
(예) 로드 시 흰색 배경 잠깐 보인 후, 빨간색으로 자동 변경됨.
<body>
<button id="hz">클릭</button>
<script>
var hz = document.getElementById("hz");
hz.addEventListener("click", function() {
document.body.style.backgroundColor = "red";
});
hz.click();
</script>
</body>
결과보기
주소 복사
랜덤 이동