Funktion entfernen Sie hintergrund-Bilder für ein element und alle seine Kinder über javascript

Möchte ich entfernen Sie alle CSS-hintergrund-Bilder für ein bestimmtes element und alle Ihrer Kinder mit Javascript. Diese Frage ist sozusagen ein spin-off auf eine andere Frage, fragte ich. Das Endziel ist das gleiche, die Haut jQuery-UI-widgets.

Ich bin derzeit mit jquery/jquery-ui wenn überhaupt, würde diese verwenden, um das problem zu lösen.

Irgendwelche Ideen?

bonus:

Wäre es wunderbar, in der Lage sein, entfernen Sie hintergrund-Bilder für verschiedene jquery-ui-Staaten, ABER die hab ich alle aber entschlossen, mich zu überschreiben diese bg von Bildern per CSS.

EX: ui-state-hover, ui-state-active haben beide hintergrund-Bilder, die mit Ihnen verbunden sind.

oder

Bitte lassen Sie mich wissen, wenn Sie denken, dass jede Art von programmatischen Abweichungen sollten nicht auf diese Weise getan (bitte geben Sie Ihre Argumentation).

  • Vielleicht könnte es ein Weg sein, um Elemente auszuwählen, die ein hintergrund-Bild zugeordnet?
  • Ich bin verwirrt, warum Sie sind nicht mit der jQuery UI ThemeRoller, oder schreiben Sie Ihre eigenen CSS-Code für diese Elemente.
  • Ball - das muss ich ändern, widget, um mehrere Stile innerhalb meiner Anwendung.
InformationsquelleAutor Derek Adair | 2010-10-26
  1. 1
    function removeChildBackgrounds(parent) {
  parent.style.backgroundImage = "none";
  var childNodes = parent.childNodes;
  for(var i=0;i<childNodes.length;i++) {
    removeChildBackgrounds(childNodes[i]);
  }
}

    Diese entfernen würde, alle Hintergründe rekursiv, beginnend mit dem übergeordneten Knoten.

    InformationsquelleAutor Thomas F.
  2. 2

    Konnte man nur ein einfaches jQuery-Selektor (langsam aber)

    //You might now need the !important, but it overrules other !important's
$( '*', givenElement ).css( 'backgroundImage', '0 !important' );

    Aber es ist besser, fügen Sie einfach eine bestimmte Klasse zu Ihrem übergeordneten element, und verwenden Sie dann die normale CSS die Kinder. Zum Beispiel:

    //Javascript
$( givenElement ).addClass( 'stateX' );

//CSS, basic example to give you an idea
.stateX div, .stateX span {
    background-image: 0;
}

.stateY div, .stateY span {
    background-image: url( someimage.png );
}
    • Was bedeutet $( '*' ) zu tun? Auch, was tut Sie, wenn gepaart mit einem anderen Selektor...?
    • * wählt alle Elemente, aber in diesem Fall innerhalb von givenElement
    • href="http://api.jquery.com/jQuery/#jQuery1" >api.jquery.com/jQuery/#jQuery1
    • Hmm... ich mag, wohin Sie gehen mit diesem, aber viele der Kinder, die Elemente erstellt werden, die über jquery-ui. Ich war wirklich denken eine Art rekursive Funktion, die erkennt, ob ein gegebenes auswahlelement Kinder hat und durchläuft, die Kinder zu sehen, wenn Sie die BG-Bilder, wenn man Sie so entfernt Sie. Ich ' ll fügen Sie diese Erläuterung in die Frage
    InformationsquelleAutor Harmen
Schreibe einen Kommentar