For my site, I'm displaying a <div> within a <noscript> tag.
In the DIV, I have an image.
Quick Example:
<noscript>
<img src="logo-sm.png" alt="Site Logo"/>
</noscript>
If JavaScript is enabled, is that image still loaded, and are CSS styles applied to it? What about DOM event listeners? I'm wondering if a lot of external content (whether it be images, videos, audios, etc.) will affect page load for people who actually allow JavaScript beforehand.
EDIT:
By the way, I don't have this site public on the web. I'm using XAMPP to view it in Chrome Canary.
If JavaScript is enabled, is that image still loaded, and are CSS styles applied to it?
Depends on browser implementations. Most of the modern browsers support the use of <noscript> tag but in some cases the <noscript> might even work incase a <script> fails to execute.
However if the <noscript> is executed (i know) then the css styles will apply to the elements on the page since they are added to the DOM
What about DOM event listeners?
If scripting is enables on the browser and you serve <noscript> content then the content should conform such that it does not cause parssing errors. Look here for more
I would advide you against the use of <noscripts> because as the manual says:
The noscript element is a blunt instrument. Sometimes, scripts might be enabled, but for some reason the page's script might fail. For this reason, it's generally better to avoid using noscript, and to instead design the script to change the page from being a scriptless page to a scripted page on the fly
Hope that helps :)