如果禁用Javascript,是否只下载noscript标记内的图像？

Question

请考虑以下示例:

<noscript>
    <img class="photo" src="example.png">
</noscript>

如果客户端禁用了Javascript,客户端是否只下载图像文件？(我知道客户端只能在此示例中禁用Javascript时才能看到图像)

我问的原因是因为我一直在外部CSS中使用base64数据URI来处理几个背景图像属性(避免http请求).我还想通过外部Javascript更新它们的值来使用base64数据URI作为某些img标签的src值(以保留缓存的好处).

从本质上讲,这一点的重点是避免/限制http请求,所以我想知道我是否可以优雅地降级并且只在Javascript被禁用时才获取图像文件？或者无论是下载图像？

Answer 1

简答:
不,图像不会在<noscript>元素中下载

技术答案:

我刚刚在我的个人网站上进行了一些测试,以获得禁用JavaScript的功能,并且遇到了这篇文章...... JavaScript仍然被禁用,顺便说一句.

好吧,在这个网页的最顶层,Stack Overflow有一条警告信息说明:

"Stack Overflow最适合启用JavaScript"

作为几乎每个网站(!)都倾向于"查看源代码"的网络极客的类型,该消息的HTML代码如下:

<noscript>
    <div id="noscript-warning">Stack Overflow works best with JavaScript enabled<img src="http://example.com/path/to/1x1-pixel.gif" alt="" class="dno"></div>
</noscript>

那里没什么破土动工.但是,我感兴趣的是IMG元素,它引用了1px xpp的不可见图像.

我假设分析/统计软件必须使用此图像来检测他们有多少用户在没有JavaScript的情况下浏览.如果这个假设是正确的(并且没有任何其他原因在这里使用我忽略的空白1x1像素图像),那么这基本上将确认以下内容:浏览器不下载NOSCRIPT元素内的任何内容,除了实际禁用JavaScript的情况.(当然,似乎没有任何复古的'98式布局技术正在进行,我很高兴地说!);-)

(PS - 我希望我不会以某种方式冒犯Stack Exchange网络上的任何人来指出这一点!)

Answer 2

HTML 4.01规范只是说noscript在某些情况下不呈现内容.但是,这表明浏览器不应该在这种情况下根据其内容执行任何GET操作,因为这样的操作将毫无意义并且会降低效率.

HTML5草案更明确,可能反映了实际的浏览器行为.它说,有关的noscript元素,在一个有力的字条:"它的工作原理是通过基本的脚本时启用,使元素的内容被视为纯文本而不是真正的元素'关闭’解析器".(该注释涉及为什么noscript在使用XHTML语法时不起作用,但它也揭示了它工作的原理,当它工作时.)

因此,我们可以预期,当启用脚本时,noscript甚至不会解析内容(除了识别结束标记).Blender的答案似乎证实了这一点,我对Firefox的小实验也是如此:

<img src=foo style="foo: 1">
<noscript>
<img src=bar style="bla: 1">
</noscript>

在启用脚本时,Firefox会发出失败的GET请求,foo但没有请求bar.此外,它foo: 1在错误控制台中显示有关错误CSS代码的警告,但没有警告bla: 1.所以显然img标签甚至都没有解析过.

但是,我没有看到问题如何与提出的情景有关.我认为您在img外部使用了一个元素,noscript并使用data:URL将所需的初始内容放在那里(作为后备,将禁用脚本时的最终内容).