This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm whether you accept or reject these cookies being set.

A cookie will be stored in your browser regardless of choice to prevent you being asked this question again. You will be able to change your cookie settings at any time using the link in the footer.

Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Klassen XY im Dokument ersetzen
#1
Hallo zusammen,

ich möchte gerne zwei Klassen auf meiner Website mit JavaScript ersetzen.
Da die Klassen bzw. die Divs öfter auf der Seite vorkommen, kann ich nicht nach einer ID abfragen, was ja meist getan wird.

Grundsätzlich möchte ich gerne class="col-sm-12 col-md-6" durch class="col-sm-12 col-md-4" und class="status-soon" durch class="hide" ersetzen.

Kann mir jemand schreiben, wie ich das am einfachsten und ohne ID-Abfrage umsetzen kann?

Danke & beste Grüße
Markus
Zitieren
#2
Dafür gibt es remove and add class
Zb für ein Element
const div =  document.querySelector('div');
div.classList.remove('col-sm-12 col-md-6');
div.classList.add('col-sm-12 col-md-4');

Für alle divs müßte es so gehen
const div =  document.querySelectorAll('div');
div.forEach(function(g){
g.classList.remove('col-sm-12 col-md-6');
g.classList.add('col-sm-12 col-md-4');
})

Ist jetzt ungetestet
Hier sind alle meine Lösungen aus allen Foren. Ich helfe auch in Facebook-chat
Als Lösung markieren Zitieren
#3
(25.08.2022, 17:12)admin schrieb: Dafür gibt es remove and add class
Zb für ein Element
const div =  document.querySelector('div');
div.classList.remove('col-sm-12 col-md-6');
div.classList.add('col-sm-12 col-md-4');

Für alle divs müßte es so gehen
const div =  document.querySelectorAll('div');
div.forEach(function(g){
g.classList.remove('col-sm-12 col-md-6');
g.classList.add('col-sm-12 col-md-4');
})

Ist jetzt ungetestet


Habe dazu alle möglichen Varianten ausprobiert, doch es will einfach nicht. 

Eine Variante z. B. wäre
        const div =  document.querySelectorAll('div');
        div.forEach(function(g){
        g.className.remove('col-md-6');
        g.className.add('col-md-4');
        })


Leider funktioniert auch das nicht.

Habe einen neuen Ansatz gefunden, mit dem ich zumindest das erste Element mit der Klasse "col-md-6" ändern kann.
Wenn man daraus jetzt noch eine Schleife zaubern könnte, die alle Elemente mit dieser Klasse ändern könnte, wäre das prima!


        function replaceClass()
        {
          var plusLinks = document.querySelectorAll('.col-md-6');
          var firstLink = plusLinks[0];
          firstLink.setAttribute('class', 'col-md-4');
        }
        replaceClass();
Als Lösung markieren Zitieren
#4
Jo , eigentlich das, was ich schon geschrieben hatte.
So geht es bei mi du siehst
Manni1012 likes this post
Hier sind alle meine Lösungen aus allen Foren. Ich helfe auch in Facebook-chat
Als Lösung markieren Zitieren
#5
Der Teufel steckt ja meist im Detail.

So funktioniert das prima! Besten Dank dafür!
Als Lösung markieren Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste