Ergebnis 1 bis 5 von 5
  1. #1
    Calvinstefan ist offline Jungspund
    registriert
    15-03-2016
    Beiträge
    15

    Question per Javascript alle versteckten Elemente suchen

    Hallo Leute!

    Würdet ihr mir bitte bei der Erstellung einer Abfrage / Verarbeitung helfen?
    Folgendes gleich vorab: jQuery, mit dem meine Anforderung einfachst umzusetzen wäre, darf ich nicht benutzen!

    Ich muss auf meiner Homepage beim Klick auf einen Button bei all denjenigen Elementen das Attribut "verify" entfernen, welche derzeit auf der Homepage nicht sichtbar sind.

    Ich hatte im Netz eine Lösung gefunden, wenn das Attribut bei allen Elementen, welche es haben, entfernt werden soll:
    Code:
    Array.from(document.querySelectorAll("*[verify]")).forEach(e => e.removeAttribute('verify'));
    Funktioniert super!

    Mein Problem ist jetzt der SELECTOR-Teil. In diesem muss abgefragt werden, ob ein Element sichtbar ist.

    Um die Sichbarkeit zu ermitteln habe ich auch schon etwas gefunden:
    Code:
    element.offsetWidth = 0 && element.offsetHeight = 0;
    Ein "display == 'none'" reicht nicht aus, deshalb würde ich gerne diese Prüfung auf das width und height nutzen.
    jQuery scheint bei :hidden ebenfalls auf diese Art und Weise zu arbeiten.

    Könntet ihr mir bitte sagen, wie ich diese Prüfung auf width und height in den Elementenselektor des querySelectorAll bekomme?

    Daaaanke!


    Gruß,
    Stefan

  2. #2
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.897

    AW: per Javascript alle versteckten Elemente suchen

    Zitat Zitat von Calvinstefan Beitrag anzeigen
    Könntet ihr mir bitte sagen, wie ich diese Prüfung auf width und height in den Elementenselektor des querySelectorAll bekomme?
    Warum muss das in den Selektor rein formuliert werden? Warum darfst du auf deiner eigenen HP kein jQuery nutzen? Das kann der Hoster doch gar nicht feststellen!? Wenn das schon nicht geht, was ist dann noch alles eingeschränkt? Erkläre bitte mal genau was da Sache ist damit es eine passende Lösung gibt.
    Das deutsche Javascript Forum http://forum.jswelt.de http://forum.jswelt.de/images/logoJsWeltForumV4_32x22.png

  3. #3
    daniel220786 ist offline Jungspund
    registriert
    29-11-2020
    Beiträge
    12

    AW: per Javascript alle versteckten Elemente suchen

    Zitat Zitat von Calvinstefan Beitrag anzeigen

    Mein Problem ist jetzt der SELECTOR-Teil. In diesem muss abgefragt werden, ob ein Element sichtbar ist.

    Um die Sichbarkeit zu ermitteln habe ich auch schon etwas gefunden:
    Was meinst du mit Sichtbar ?
    Nur das was du auf den Bildschirm siehst und nicht irgendwo weit unten auf der Page ?

    Wenn ja.
    Ich hatte schon mal ein Thema gehabt wo man das auch auslesen musste.Da ging es um den Footer ob der im Sichtbaren Bereich ist, gar nicht zu sehen , oder ganz zusehen.
    In mein Beispiel siehst du an den TOP Button was gerade davon ist.

    Das könntest du Theoretisch so auch bei dir nutzen wenn ich dich richtig verstanden habe.
    https://codepen.io/basti1012/pen/JjNdrvm

    Lass dich nicht wegen de Jquery einbindung täuschen, das wird hier nicht gebraucht
    Geändert von daniel220786 (22-08-2021 um 22:15 Uhr)

  4. #4
    Calvinstefan ist offline Jungspund
    registriert
    15-03-2016
    Beiträge
    15

    AW: per Javascript alle versteckten Elemente suchen

    Hallo!
    Also wegen mir muss der Codeteil der Prüfung auf width und height nicht mit in den Elementenselektorteil des querySelectorAll. Ich hatte gehofft, dass man sich so eine zusätzliche Schleife über das Elementearray sparen könnte.
    Und kein jQuery ist bei dem "Projekt" vorgegeben. Alle Argumente meinerseits, es doch zuzulassen, wurden abgebügelt.

    Mit "Sichtbar" meinte ich alle Elemente der "Homepage" welche width = 0 und height = 0 sind. Dabei kann es sich auch um Elemente handeln, die derzeit außerhalb des sichtbaren Browserfensters liegen.

    Also ... gibt es eine Möglichkeit mit wenig Code
    a. alle Elemente zu selektieren, welche width = 0 und height = 0 sind und
    b. an diesen dann das Attribut "verify" zu entfernen?

    Danke Euch!

    Gruß,
    Stefan.

  5. #5
    daniel220786 ist offline Jungspund
    registriert
    29-11-2020
    Beiträge
    12

    AW: per Javascript alle versteckten Elemente suchen

    Mein Code hatte kein Jquery gebraucht, man hätte die einbindung einfach löschen können.
    Ist aber auch egal , weil ich es falsch verstanden habe.

    Ich würde das dann so machen
    HTML-Code:
    var alles=document.querySelectorAll('*[verify]');
    alles.forEach(function(e){
        let wi_kleiner=false;
        let hi_kleiner=false;
        let wi=e.getBoundingClientRect().width.toFixed(0);
        let hig=e.getBoundingClientRect().height.toFixed(0)
        if(wi<=0){
            wi_kleiner=true;
        }else{
            console.log('Breiter als 0 und zwar '+wi)
        }
        if(hig<=0){
            hi_kleiner=true;
        }else{
            console.log('Höher als 0 und zwar '+hig)
        }
        if(hi_kleiner==true && wi_kleiner==true){
            e.removeAttribute('verify');
            console.log('Höhe und breite gleich 0 ,Attributte gelöscht')
        }
    })
    Ist jetzt etwas ausführlicher.
    Man könnte aber noch etwas Code löschen wenn es dir zu lang ist.
    Ich hoffe das ich dir jetzt helfen konnte und es richtig verstanden habe

    - - - Aktualisiert - - -

    Und ob ein Element wirklich display:none ist , ob Inline style oder über die CSS gesetzt.
    Würde ich das so abfragen
    HTML-Code:
    var alles=document.querySelectorAll('*[verify]');
    alles.forEach(function(e){
      wi=window.getComputedStyle(e).display;
        if(wi=='none'){
            e.removeAttribute('verify');
            console.log('Display ist none ,Attributte gelöscht')
        }
    })

Ähnliche Themen

  1. Wie finde ich alle leere <p> Elemente?
    Von pstein im Forum JavaScript
    Antworten: 6
    Letzter Beitrag: 16-10-2013, 14:07
  2. Elemente im frame Dschungel suchen.
    Von Zerod im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 28-01-2011, 12:22
  3. Alle Elemente im Dokument durchgehen
    Von Schaelle im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 04-07-2007, 17:03
  4. alle elemente nach Id durchsuchen
    Von aleksej im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 29-10-2002, 22:24
  5. Antworten: 1
    Letzter Beitrag: 09-06-2002, 22:20

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •