Adding quotes in js style assignment

Issue

I have this JavaScript code:

function setbackground(src, style=BackgroundFillMethod.Auto) {
    document.body.style.background = `url(${src})`;
    console.log(`url(${src})`);
    document.body.style.backgroundSize = style.ToString();
}

It logs this:

url(google.com/favicon.ico)

But sets body style as this: style="background: url("google.com/favicon.ico");" Why qoutes adding? I tried theese too:

"url(" + src + ")"
"url(\"" + src + "\")"
`url(\"${src}\")`

Still style="background: url("google.com/favicon.ico");", not removing quotes or adding extra quotes.

(By the way it isn't causing an issue, only I want to get why quotes adding and is there any way to remove them)

Solution

Assuming you're checking the result in your browser's element inspector, what's happening is that the browser has chosen to format your style addition in that way.

When you request any change to the DOM, the browser will first process the request, check that it's valid and only then update the DOM accordingly. What you see in the inspector is not the original source, but a live representation of how the browser interprets the source. I'm unaware of any browser that will not use the least ambiguous formatting in this view, which for a url will include quotes. Since the style you're adding is being inlined, these quotes need to be escaped; hence ".

Answered By - JPC