• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] IMG Tags löschen bei bestimmter src Domain

E

eliander

New member
Hallo Community,
Ich kenn mich mit der Javascript Programmiereung noch nicht so gut aus deshalb komm ich mit meinem Problem nicht mehr weiter.
Ich möchte einen Code schreiben der ein Bilder löscht wenn es eine bestimmte src domain hat.

Bspl.
<img src="http://api.ning.com/files/58v-ee3J3CKynDP9SP5XWVzvdxL772zI2e2L4c7c8D6Ngtj8lHlRwqORTjPaxBcqCWvIW36Sjw*ZaU9Hhq5G0Kvl-kUR3LS8/google_logo.png">

In den Code würde ich dann alle Bilder mir der Domain http://api.ning.com löschen wollen.

Mein Jetziger Code löscht jedoch nicht alle Bilder.

Edit fiddle - JSFiddle

Könnt ihr mir helfen?

LG Elias
 
Zuletzt bearbeitet:
Klassischer DOM-Fehler: document.getElementsByTagName() liefert eine HTML-Collection. Diese ist immer aktuell. So wird das erste Bild, das du aus dem DOM mit .removeChild() entfernst auch aus der HTML-Collection entfernt und du hast ein Element weniger drin und deine Indizes für deine anderen Elemente verschieben sich.

Als Lösung kannst du entweder aus der HTML-Collection ein Array machen (einfach in ein Array kopieren oder mittels Array.prototype.slice.call()) oder die Schleife rückwärts laufen lassen.
 
Hallo,
Ich kenn mich noch nicht so gut mit JavaScript aus.
Ist das was ich gemacht habe vollkommen falsch?
HTML: 
imgs = new Array(document.getElementsByTagName('img'));
for (var i = 0; i < imgs.length; i++) {
    pathArray = imgs[i].getAttribute('src').split('/');
    protocol = pathArray[0];
    host = pathArray[2];
    url = protocol + '//' + host;
    if (url == ('http://api.ning.com')) {
        
imgs[i].prototype.slice.call());
    }
}

Es funktioniert gar nicht mehr.
LG Elias
 
Zuletzt bearbeitet von einem Moderator:
Bitte verwende für Quellcode die HMTL Tags.
Mach doch die Schleife einfach rückwärts:
HTML: 
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>
	<img src="http://api.ning.com/files/58v-ee3J3CKynDP9SP5XWVzvdxL772zI2e2L4c7c8D6Ngtj8lHlRwqORTjPaxBcqCWvIW36Sjw*ZaU9Hhq5G0Kvl-kUR3LS8/google_logo.png">
	<img src="http://api.ning.com/files/58v-ee3J3CKynDP9SP5XWVzvdxL772zI2e2L4c7c8D6Ngtj8lHlRwqORTjPaxBcqCWvIW36Sjw*ZaU9Hhq5G0Kvl-kUR3LS8/google_logo.png">
	<img src="http://api.ning.com/files/58v-ee3J3CKynDP9SP5XWVzvdxL772zI2e2L4c7c8D6Ngtj8lHlRwqORTjPaxBcqCWvIW36Sjw*ZaU9Hhq5G0Kvl-kUR3LS8/google_logo.png">
</p>
<script>
var imgs = document.getElementsByTagName('img');
for (var i = imgs.length-1; i >= 0; i--) {
    pathArray = imgs[i].getAttribute('src').split('/');
    protocol = pathArray[0];
    host = pathArray[2];
    url = protocol + '//' + host;
    if (url == ('http://api.ning.com')) {
        imgs[i].parentNode.removeChild(imgs[i]);
    }
}
</script>
</body>
</html>
 
Eine Randbemerkung noch: warum machst du es dir so kompliziert beim Auslesen der Domain? Ist es Absicht, dass bspw. https://api.ning.com oder http://www.api.ning.com nicht entfernt werden?
Meiner Meinung nach ist es einfacher, mit folgendem Schnipsel nur den Host auszulesen
Code: 
var url = "https://www.example.com/script.php?location=home#start"

var domain = url.replace('http://','').replace('https://','').replace('www.','').split(/[/?#]/)[0];

alert(domain); //liefert "example.com
und dann braucht man in der if-Abfrage nur noch auf "example.com" prüfen, statt auf
  • http://example.com/
  • https://example.com/
  • http://www.example.com/
  • https://www.example.com/
 
@eliander: dem Array-Konstruktor (den man sowieso möglichst vermeiden sollte, da er keinen Vorteil bringt und seltsames Verhalten an den Tag legen kann) die HTML-Collektion als Parameter zu übergeben, hat hier nicht den gewünschten Effekt.

Eine HTML-Kollection in ein Array zu kopieren geht am einfachsten so:
Code: 
var ARRAY = Array.prototype.slice.call(HTML_COLLECTION);
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben