HTML DOM Caption 개체는 HTML
속성
참고 :아래 속성은 HTML5에서 지원하지 않습니다.
다음은 HTML DOM 캡션 개체 속성입니다 -
| 속성 | 설명 |
|---|---|
| 정렬 | 캡션 정렬을 설정하거나 반환합니다. |
구문
다음은 −
의 구문입니다.캡션 개체 만들기 -
var x = document.createElement("CAPTION"); 예시
HTML DOM 캡션 개체에 대한 예를 살펴보겠습니다. -
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px double black;
margin-top: 14px;
}
</style>
</head>
<body>
<p>Click the button below to create the caption for the table.</p>
<button onclick="createCaption()">CREATE</button>
<table id="SampleTable">
<tr>
<td colspan="2" rowpan="2">TABLE</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
</table>
<script>
function createCaption() {
var x = document.createElement("CAPTION");
var t = document.createTextNode("TABLE CAPTION");
x.appendChild(t);
var table = document.getElementById("SampleTable")
table.insertBefore(x, table.childNodes[0]);
}
</script>
</body>
</html> 출력
이것은 다음과 같은 출력을 생성합니다 -
CREATE 버튼 클릭 시 -
위의 예에서 -
먼저 CREATE 버튼을 생성하여 클릭 시 createCaption() 메소드를 실행했습니다 -
<button onclick="createCaption()">CREATE</button>
createCaption() 메서드는 문서 객체의 createElement() 메서드를 사용하여 캡션 요소를 생성하고 변수 x에 할당합니다. 그런 다음 "TABLE CAPTION" 텍스트가 있는 텍스트 노드를 생성했습니다. 그런 다음 요소에 텍스트 노드를 추가했습니다.
마지막으로 id "SampleTable"을 사용하여