Heim >Web-Frontend >Front-End-Fragen und Antworten >So verbergen Sie ein Element in JQuery

So verbergen Sie ein Element in JQuery

藏色散人
藏色散人Original
2021-11-15 11:04:588039Durchsuche

So verstecken Sie ein Element in jquery: 1. Erstellen Sie eine HTML-Beispieldatei. 2. Legen Sie die ID für das Element fest. 3. Verstecken Sie das Element mit der Methode „$(“#id“).hide().

So verbergen Sie ein Element in JQuery

Die Betriebsumgebung dieses Artikels: Windows 7-System, JQuery-Version 3.2.1, DELL G3-Computer

Wie verstecke ich ein Element in JQuery?

Mehrere Möglichkeiten, das Ausblenden und Anzeigen von Elementen mit jquery zu steuern:

Die Organisation ist etwas chaotisch, bitte haben Sie etwas Geduld!

Verwenden Sie jquery, um das Anzeigen und Ausblenden von Divs zu steuern, was in einem Satz erfolgen kann, zum Beispiel:

1.$("#id").show() wird ausgedrückt als display:block,

$("#id").hide() wird ausgedrückt als display:none;

2.$("#id").toggle() schaltet den sichtbaren Zustand des Elements um. Wenn das Element sichtbar ist, schalten Sie es auf „Ausgeblendet“ um. Wenn das Element ausgeblendet ist, schalten Sie es auf „Sichtbar“ um.

3.$("#id").css('display','none');//Ausblenden

$("#id").css('display','block');//Anzeige

Oder

$("#id")[0].style.display='none';

  display=none steuert die versteckte Suche nach Objekten

 display=block steuert die Anzeige von Objekten

4.$ (" #id").css('visibility','hidden');//Element ausgeblendet

$("#id").css('visibility','visible');//Element angezeigt

CSS Sichtbarkeitseigenschaft Gibt an, ob das Element sichtbar ist.

visible Das Element ist sichtbar.

hiddenDas Element ist unsichtbar.

collapseBei Verwendung in einem Tabellenelement kann dieser Wert eine Zeile oder Spalte löschen, hat jedoch keinen Einfluss auf das Layout der Tabelle. Der von einer Zeile oder Spalte belegte Platz wird für andere Inhalte freigegeben. Wenn dieser Wert für ein anderes Element verwendet wird, wird er als „versteckt“ dargestellt.

inherit Erbt den Wert des Sichtbarkeitsattributs vom übergeordneten Element.

Hinweis:

display:none und sichtbar:hidden können beide ein Element auf der Webseite verbergen. Es gibt keinen Unterschied in den visuellen Effekten, aber es gibt einen Unterschied zwischen den beiden bei einigen DOM-Operationen:

display:none -. - Für das versteckte Objekt ist kein physischer Platz reserviert, das heißt, das Objekt verschwindet vollständig von der Seite und kann, um es für Laien auszudrücken, weder gesehen noch berührt werden.

visible:hidden--- macht das Objekt auf der Webseite unsichtbar, aber der vom Objekt auf der Webseite eingenommene Platz ändert sich nicht, das heißt, es verfügt weiterhin über Attribute wie Höhe, Breite usw. Um es für Laien auszudrücken , es kann nicht gesehen, aber berührt werden.

//第1种方法 ,给元素设置style属性  
$("#hidediv").css("display", "block");  
//第2种方法 ,给元素换class,来实现隐藏div,前提是换的class样式定义好了隐藏属性  
$("#hidediv").attr("class", "blockclass");  
//第3种方法,通过jquery的css方法,设置div隐藏  
$("#blockdiv").css("display", "none");  
  
$("#hidediv").show();//显示div    
$("#blockdiv").hide();//隐藏div

Empfohlenes Lernen: „JQuery-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo verbergen Sie ein Element in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn