Bildladen über asynchrone Callbacks in JavaScript

Lassen Sie uns die Funktion loadImage implementieren, die Bilder laden wird. Lassen Sie diese Funktion als ersten Parameter den Pfad zum Bild akzeptieren, und als zweiten - einen Callback, der ausgeführt wird, wenn das Bild geladen ist:

loadImage('img.png', function() {
	// wird beim Laden des Bildes ausgeführt
});

Lassen Sie in den ersten Parameter unseres Callbacks ein Verweis auf das DOM-Element des Bildes übergeben werden, und in den zweiten - ein Fehler, falls eine Ausnahmesituation auftritt:

loadImage('img.png', function(image, err) {
	console.log(image, err);
});

Wir können unsere Funktion wie folgt verwenden:

loadImage('image.png', function(image, err) {
	document.body.append(image); // platziere das Bild nach dem Laden
});

Oder mit der Behandlung einer Ausnahmesituation:

loadImage('image.png', function(image, err) {
	if (!err) {
		document.body.append(image);
	} else {
		console.log('ein Fehler ist aufgetreten: ' + err);
	}
});

Implementieren Sie die Funktion loadImage. Verwenden Sie dafür den von Ihnen zuvor gelernten Code zum Laden von Bildern.