목차
- <dialog> 객체 정의 - 대화상자
- <dialog> 객체 구문
- <dialog> 객체 예제 - 접근
- <dialog> 객체 예제 - 생성
- <dialog> 객체 속성
<dialog> 객체 정의 - 대화상자
HTML <dialog> 태그(요소) 의미.
PS.
Chrome 37+, Safari 6+, Opera 24+ 브라우저만 지원.
IE, Firefox 브라우저는 지원X
<dialog> 객체 구문
[접근]
var x = document.getElementById("요소ID");
[생성]
var x = document.createElement("DIALOG");
<dialog> 객체 예제 - 접근
<button onclick="homzzang()">클릭</button>
<dialog id="hz">Homzzang.com</dialog>
<script>
function homzzang() {
var x = document.getElementById("hz");
x.open = true;
}
</script>
결과보기
<dialog> 객체 예제 - 생성
<button onclick="homzzang()">클릭</button>
<script>
function homzzang() {
var x = document.createElement("DIALOG");
var t = document.createTextNode("Homzzang.com");
x.setAttribute("open", "open");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
결과보기
<dialog> 객체 속성
open
대화상자를 열지 여부를 설정/반환.
returnValue
대화상자의 반환값을 설정/반환.
<dialog> 객체 메서드
close()
대화상자 닫기.
show()
대화상자 표시.
showModal()
대화상자 표시하고이를 최상위 모달 대화 상자로 만들기.
※ <dialog> 객체는 표준 속성/메서드/이벤트 지원.