JavaScript では、 スタイル.ディスプレイ または、 スタイル.可視性 。の 可視性 JavaScript のプロパティは、要素を非表示にするためにも使用されます。の違いは、 スタイル.ディスプレイ そして スタイル.可視性 使用時です 可視性: 非表示、 タグは表示されませんが、スペースが割り当てられます。使用する ディスプレイ: なし、 タグも表示されませんが、ページ上にスペースが割り当てられていません。

HTML では、 隠れた 属性を使用して、指定した要素を非表示にします。とき 隠れた HTML の属性が true に設定されている場合、要素が非表示になっている場合、または値が 間違い、 要素が表示されます。

構文

要素を非表示にするための一般的な構文 style.hidden そして スタイル.可視性 は次のように与えられる。

使用する style.hidden

 document.getElementById('element').style.display = 'none'; 

使用する スタイル.可視性

 document.getElementById('element').style.visibility = 'none'; 

次に、要素の非表示を理解するためにいくつかの例を見てみましょう。 JavaScript 。

例1

この例では、JavaScript を使用して要素を削除する方法を見ていきます。 スタイル.ディスプレイ 財産。ここに、 ディビジョン 要素と、指定されたクリック時に非表示になる段落要素 HTMLボタン 。をクリックする必要があります 「クリックしてください！」 ボタンをクリックして効果を確認します。

 style.display <h2> Using both style.visibility and style.display properties </h2> This is the div element. <p> This is a paragraph element. </p> <h3 id="heading"> This is the heading after the paragraph element. </h3> Click me! function fun() { document.getElementById(&apos;div&apos;).style.visibility = &apos;hidden&apos;; document.getElementById(&apos;heading&apos;).style.display = &apos;none&apos;; } 

出力

出力では、次のことがわかります。 ディビジョン 要素 (適用した要素) スタイル.可視性 property) は非表示になっていますが、スペースは割り当てられています。しかし、見出し（私たちが適用したもの）は、 スタイル.ディスプレイ プロパティ）が隠蔽されており、スペースが割り当てられていません。

ボタンをクリックすると、結果は次のようになります -