HTML DOM 인용 객체

<시간/>

HTML DOM 인용 개체는 HTML 요소와 연결됩니다. 요소는 인용된 창작물에 대한 참조를 제공하는 데 사용되며 제목이 포함되어야 합니다. 그림, 책, TV 쇼, 영화 등이 될 수 있습니다.

구문

다음은 −

의 구문입니다.

인용 개체 만들기 -

var x = document.createElement("CITE");

예시

HTML DOM 인용 개체의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<p>Click the below button to create a CITE element.</p>
<button onclick="createCite()">CREATE</button><br><br>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-
_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-
_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">
<script>
   function createCite() {
      var x = document.createElement("CITE");
      var t = document.createTextNode("The Starry night.");
      x.appendChild(t);
      document.body.appendChild(x);
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM 인용 객체

"만들기"를 클릭하십시오 -

HTML DOM 인용 객체

위의 예에서 태그 −

를 사용하여 이미지를 삽입했습니다.

<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">

그런 다음 createCite() 메서드를 실행하기 위해 CREATE 버튼을 만들었습니다.

<button onclick="createCite()">CREATE</button>

createCite() 메서드는 요소를 만들고 변수 x에 할당합니다. 일부 텍스트를 포함하는 텍스트 노드가 생성되어 변수 t에 할당됩니다. 그런 다음 텍스트 노드는 변수 x의 appendChild() 메서드를 사용하여 요소에 추가됩니다. 그런 다음 텍스트 노드와 함께 요소가 문서 본문의 appendChild() 메서드를 사용하여 문서 본문에 추가됩니다.