HTML DOM 引用对象

HTML DOM 引用对象表示 HTML 文档的 <q> 元素。

我们来创建一个 q 对象 −

语法

以下为语法 −

document.createElement(“Q”);

属性

以下是引用对象的属性 −

属性	说明
cite	它返回和更改 HTML 文档中引用元素的 cite 属性的值。

示例

让我们看一个 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>