Base64 background-image not displaying-CodePudding

I am trying to set a div's background to a base64 image dynamically. The base64 image itself is stored in a string variable, base64Image. I am using the following line of code.

$("#loadingAdImage").css("background-image", `url("${base64Image}")`);

When I inspect the the div element, I find that even though the line was executed, the div has no style attribute. I even tried the following.

$("#loadingAdImage").attr("style", `background-image: url('${base64Image}')`);

This time when I inspected the div element, I got the style attribute, but the image itself isn't displaying in the background. Does anyone know what's wrong?

CodePudding user response：

Use an img tag for #loadingAdImage

then use this code

    $("#loadingAdImage").attr("src", "data:image/png;base64, " base64Image);

CodePudding user response：

The only way I can think of where this would happen is for base64Image to contain a " character.

Any other value would set the property correctly given your code:

const sources = [
 "foo bar'¨^*-0 :.?/#`