HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLDOM見積もりオブジェクト

HTML DOM引用オブジェクトは、HTMLドキュメントの要素を表します。

qオブジェクトを作成しましょう-

構文

以下は構文です-

document.createElement(“Q”);

プロパティ

見積もりオブジェクトのプロパティは次のとおりです-

プロパティ 説明
cite HTMLドキュメントのquote要素のcite属性の値を返し、変更します。

例

HTMLDOM引用オブジェクトの例を見てみましょう-

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

出力

これにより、次の出力が生成されます-

HTMLDOM見積もりオブジェクト

「見積もりオブジェクトを作成する」をクリックします 」ボタンをクリックして見積もりオブジェクトを作成します-

HTMLDOM見積もりオブジェクト


  1. HTMLDOMHRオブジェクト

    HTML DOM HRオブジェクトは、HTMLドキュメントの要素を表します。 hrオブジェクトを作成- 構文 以下は構文です- document.createElement(“HR”); hrオブジェクトの例を見てみましょう- 例 <!DOCTYPE html> <html> <style>    body {       text-align: center;       background-color: #fff;    

  2. HTMLDOMUlオブジェクト

    HTMLのHTMLDOMUlオブジェクトは、 を表します 要素。 を作成する 要素 var ulObject = document.createElement(“UL”) ここでは、「ulObject」 次のプロパティを持つことができますが、 HTML5ではサポートされていません − プロパティ 説明 コンパクト 順不同リストを通常より小さく表示するかどうかを設定/返します タイプ 順序付けされていないリストのtype属性の値を設定/返します 順不同リストの例を見てみましょう 要素- 例 <!DOCTYPE