Đối tượng Trích dẫn DOM HTML

Đối tượng Trích dẫn DOM trong HTML đại diện cho phần tử của tài liệu HTML.

Hãy để chúng tôi tạo đối tượng q -

Cú pháp

Sau đây là cú pháp -

document.createElement(“Q”);

Thuộc tính

Sau đây là các thuộc tính của đối tượng trích dẫn -

Thuộc tính	Giải thích
trích dẫn	Nó trả về và thay đổi giá trị của thuộc tính cite của phần tử trích dẫn trong tài liệu HTML.

Ví dụ

Hãy để chúng tôi xem một ví dụ về đối tượng trích dẫn DOM HTML -

<!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>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Đối tượng Trích dẫn DOM HTML

Nhấp vào “ Tạo đối tượng báo giá ”Để tạo đối tượng trích dẫn -

Đối tượng Trích dẫn DOM HTML