Auf Thema antworten 2026

Beitrag

<blockquote data-quote="mindraper" data-source="post: 1942541" data-attributes="member: 115163">AW: Javascript: divs anzeigen / ausblenden funktioniert leider nur teilweisei&#039;m back <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile&nbsp; &nbsp; :)" loading="lazy" data-shortname=":)" />schon älter, aber ich geb&#039; hier dennoch mal meinen senf ab, um die letzte frage vom TE zu beantworten.@buyas:nein. es macht performanceseitig überhaupt keinen unterschied, ob du ein element auf display:hidden; oder visibility:hidden; setzt. oder der unterschied ist so signifikant gering, dass das menschliche auge ihn unmöglich wahrnehmen würde.die zwei functions von pitTi funktionieren, weil deine abfrage am beginn deiner show() und hide() functions fehlerhaft war/ist und pitTi diese abfrage einfach nicht in seine variante übernommen hat.wie cebito schon gesagt hat, bedeutet ein vergleich mit != oder !== soviel wie &quot;ist nicht gleich&quot; ( in diesem fall wäre die zweite variante strenger als die erste ).das soll heissen, dass du beispielsweise in deiner show-function anstattfunction show( divid ){&nbsp;&nbsp; if( document.getElementById( divid ).style.display != &#039;hidden&#039; ){&nbsp; &nbsp; &nbsp; document.getElementById( divid ).style.display = &#039;block&#039;;&nbsp;&nbsp; }}die if-abfrage auf folgende art schreiben müsstestfunction show( divid ){&nbsp;&nbsp; if( document.getElementById( divid ).style.display === &#039;hidden&#039; ){&nbsp; &nbsp; &nbsp; document.getElementById( divid ).style.display = &#039;block&#039;;&nbsp;&nbsp; }}falls du dir wirklich gedanken machen solltest, was die performance angeht, dann noch ein tipp:vermeide möglichst, das dokument ständig nach einzelnen oder mehreren elementen zu durchsuchen. dass soll heissen: alleine in show() wird das dokument ja 2mal nach einem element mit der übergebenen id ( siehe &quot;divid&quot; ) durchsucht. bei einer suche nach id sollte das nicht sonderlich ins gewicht fallen, anders sieht es aus, wenn du nach elementen mit class suchst und einen browser unterstützen willst, der weder document.getElementsByClassName noch document.querySelectorAll unterstützt ( beispielsweise der MSIE 7 ). in diesem fall müsstest du dir nämlich eine eigene function bauen, die sich zunächst ALLE elemente des dokumentes holt und diese in einer schleife durchläuft und die entsprechenden rausfiltert. z. b. sowas:[PHP]// getByClass ist, falls verfügbar, eine native browsermethode, sonst eine eigene functionvar getByClass = function( classname ){&nbsp; &nbsp; &nbsp; &nbsp; // gibt es eine native browsermethode? dann nutze diese&nbsp; &nbsp; if( typeof document.getElementsByClassName !== &#039;undefined&#039; ){&nbsp; &nbsp; &nbsp; &nbsp; return document.getElementsByClassName( classname );&nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; // keine native methode vorhanden. eigene implementierung&nbsp; &nbsp; // deklarieren von variablen. allElems sind ALLE im document enthaltenen dom-elemente mit nodeType === 1&nbsp; &nbsp; var i, j, clnm = new RegExp( &#039;\\b&#039; + classname + &#039;\\b&#039; ),&nbsp; &nbsp; &nbsp; &nbsp; ret = [],&nbsp; &nbsp; &nbsp; &nbsp; allElems = document.all || document.getElementsByTagName( &#039;*&#039; );&nbsp; &nbsp; &nbsp; &nbsp; // allElems durchsuchen und bei treffer herausfiltern&nbsp; &nbsp; for( i = 0; i &lt; allElems.length; i = i+1 ){&nbsp; &nbsp; &nbsp; &nbsp; if( clnm.test( allElems[i].className ) ){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ret.push( allElems[i] );&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // array mit gefundenen elementen oder leeres array bei keinem fund zurückgeben&nbsp; &nbsp; return ret;};[/PHP]wie du dir vorstellen kannst, dauert es länger, ALLE dom-knoten zu durchsuchen, als nur ein einzelnes element zu finden via id. damit der browser nun nicht jedesmal alle knoten durchlaufen muss, könntest du die entsprechenden elemente in einer variablen speichern und mit dieser arbeiten. kurz gesagt, würde z. b. show dann so aussehen:function show( divid ){&nbsp;&nbsp; var div = document.getElementById( divid );&nbsp;&nbsp; if( div.style.display === &#039;none&#039; ){&nbsp; &nbsp; &nbsp; div.style.display = &#039;block&#039;;&nbsp;&nbsp; }}um es noch schneller zu bekommen, könntest du diese variablen sogar in deinem falle global verfügbar machen:var div_1 = document.getElementById( &#039;div1&#039; ),&nbsp; &nbsp;&nbsp; div_2 = document.getElementById( &#039;div2&#039; );function show(){&nbsp;&nbsp; if( this.style.display === &#039;none&#039; ){&nbsp; &nbsp; &nbsp; this.style.display = &#039;block&#039;;&nbsp;&nbsp; }}div_1.onclick = show;div_2.onclick = show;eigentlich bin ich ja gegen spaghetti-code und das setzen von globalen variablen aber OK <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile&nbsp; &nbsp; :)" loading="lazy" data-shortname=":)" />hoffe das hilft</blockquote>

[QUOTE="mindraper, post: 1942541, member: 115163"] [b]AW: Javascript: divs anzeigen / ausblenden funktioniert leider nur teilweise[/b] i'm back :) schon älter, aber ich geb' hier dennoch mal meinen senf ab, um die letzte frage vom TE zu beantworten. @buyas: nein. es macht performanceseitig überhaupt keinen unterschied, ob du ein element auf display:hidden; oder visibility:hidden; setzt. oder der unterschied ist so signifikant gering, dass das menschliche auge ihn unmöglich wahrnehmen würde. die zwei functions von pitTi funktionieren, weil deine abfrage am beginn deiner show() und hide() functions fehlerhaft war/ist und pitTi diese abfrage einfach nicht in seine variante übernommen hat. wie cebito schon gesagt hat, bedeutet ein vergleich mit != oder !== soviel wie "ist nicht gleich" ( in diesem fall wäre die zweite variante strenger als die erste ). das soll heissen, dass du beispielsweise in deiner show-function anstatt function show( divid ){ if( document.getElementById( divid ).style.display != 'hidden' ){ document.getElementById( divid ).style.display = 'block'; } } die if-abfrage auf folgende art schreiben müsstest function show( divid ){ if( document.getElementById( divid ).style.display === 'hidden' ){ document.getElementById( divid ).style.display = 'block'; } } falls du dir wirklich gedanken machen solltest, was die performance angeht, dann noch ein tipp: vermeide möglichst, das dokument ständig nach einzelnen oder mehreren elementen zu durchsuchen. dass soll heissen: alleine in show() wird das dokument ja 2mal nach einem element mit der übergebenen id ( siehe "divid" ) durchsucht. bei einer suche nach id sollte das nicht sonderlich ins gewicht fallen, anders sieht es aus, wenn du nach elementen mit class suchst und einen browser unterstützen willst, der weder document.getElementsByClassName noch document.querySelectorAll unterstützt ( beispielsweise der MSIE 7 ). in diesem fall müsstest du dir nämlich eine eigene function bauen, die sich zunächst ALLE elemente des dokumentes holt und diese in einer schleife durchläuft und die entsprechenden rausfiltert. z. b. sowas: [PHP] // getByClass ist, falls verfügbar, eine native browsermethode, sonst eine eigene function var getByClass = function( classname ){ // gibt es eine native browsermethode? dann nutze diese if( typeof document.getElementsByClassName !== 'undefined' ){ return document.getElementsByClassName( classname ); } // keine native methode vorhanden. eigene implementierung // deklarieren von variablen. allElems sind ALLE im document enthaltenen dom-elemente mit nodeType === 1 var i, j, clnm = new RegExp( '\\b' + classname + '\\b' ), ret = [], allElems = document.all || document.getElementsByTagName( '*' ); // allElems durchsuchen und bei treffer herausfiltern for( i = 0; i < allElems.length; i = i+1 ){ if( clnm.test( allElems[i].className ) ){ ret.push( allElems[i] ); } } // array mit gefundenen elementen oder leeres array bei keinem fund zurückgeben return ret; }; [/PHP] wie du dir vorstellen kannst, dauert es länger, ALLE dom-knoten zu durchsuchen, als nur ein einzelnes element zu finden via id. damit der browser nun nicht jedesmal alle knoten durchlaufen muss, könntest du die entsprechenden elemente in einer variablen speichern und mit dieser arbeiten. kurz gesagt, würde z. b. show dann so aussehen: function show( divid ){ var div = document.getElementById( divid ); if( div.style.display === 'none' ){ div.style.display = 'block'; } } um es noch schneller zu bekommen, könntest du diese variablen sogar in deinem falle global verfügbar machen: var div_1 = document.getElementById( 'div1' ), div_2 = document.getElementById( 'div2' ); function show(){ if( this.style.display === 'none' ){ this.style.display = 'block'; } } div_1.onclick = show; div_2.onclick = show; eigentlich bin ich ja gegen spaghetti-code und das setzen von globalen variablen aber OK :) hoffe das hilft [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?