HTML DOM 인용 객체

HTML DOM 인용 개체는 HTML 문서의 요소를 나타냅니다.

q 개체를 생성해 보겠습니다 -

구문

다음은 구문입니다 -

document.createElement(“Q”);

속성

다음은 인용 개체의 속성입니다 -

속성	설명
인용	HTML 문서에서 인용 요소의 인용 속성 값을 반환하고 변경합니다.

예시

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

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
      background-color:#fff;
      color:#0197F6;
   }
   h1{
      color:#23CE6B;
   }
   .drop-down{
      width:35%;
      border:2px solid #fff;
      font-weight:bold;
      padding:8px;
   }
   .btn{
      background-color:#fff;
      border:1.5px dashed #0197F6;
      height:2rem;
      border-radius:2px;
      width:60%;
      margin:2rem auto;
      display:block;
      color:#0197F6;
      outline:none;
      cursor:pointer;
   }
   p{
      font-size:1.2rem;
      background-color:#db133a;
      color:#fff;
      padding:8px;
   }
</style>
</head>
<body>
<h1>DOM quote Object Demo</h1>
<button onclick="createQuote()" class="btn">Create a quote object</button>
<script>
   function createQuote() {
      var qElement = document.createElement("Q");
      qElement.innerHTML="WordPress is software designed for everyone, emphasizing accessibility,
      performance, security, and ease of use. We believe great software should work with minimum set
      up, so you can focus on sharing your story, product, or services freely. ";
      qElement.setAttribute("cite","https://wordpress.org/about/");
      document.body.appendChild(qElement);
   }
</script>
</body>
</html>

출력

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

HTML DOM 인용 객체

"따옴표 개체 만들기를 클릭합니다. ” 버튼을 눌러 인용 개체 생성 -

HTML DOM 인용 객체