Question

我有一个带有图片滑块的网站。当幻灯片进入视图时，我将一些图像标记保持为空，因为图像会加载，以加快页面加载速度。图像标签定义如下：

import org.apache.spark.SparkContext._

val f = sc.parallelize(Array(1,2,3,4,5))
val g: PairRDDFunctions[String, Int] = f.map( x => (x.toString, x))

我正在做的是滑动功能我使用jQuery动画将<img data-src="img/portfolio-desktop1-small.png" src="" alt=""/>更改为src。滑块效果很好。我的问题是当我尝试在w3c validation tool中验证它时，它会出现以下错误：

第131行，第179列：元素data-src上属性src的值不正确：必须为非空。
img
网址语法：
任何网址。例如：...data-src="img/portfolio-desktop1-small.jpg" src="" alt=""/>，/hello或#canvas。＆GT;字符应在NFC中表示，空格应转义为http://example.org/。

有没有解决这个问题而不改变JavaScript或CSS？如果我这样离开，这件事可能会产生什么后果？

Answer 1

将图片src属性设置为#：

<img data-src="img/portfolio-desktop1-small.png" src="#" alt="Thumbnail">

HTML传递了W3C验证器，现代浏览器知道不会尝试加载不存在的图像。*

相比之下，使用引用不存在的文件的src值会导致不必要的HTTP请求和错误：

<img data-src="img/portfolio-desktop1-small.png" src="bogus.png" alt="Thumbnail">

无法加载资源：在此服务器上找不到请求的URL。

*注意：我读过有关浏览器如何处理#的相互矛盾的信息。如果有人有确切信息，请添加评论。

另请参阅 sideshowbarker 关于action属性的相关答案：
https://stackoverflow.com/a/32491636

Answer 2

如果您只是删除src属性，然后在需要时即时添加它会发生什么。 src属性不是必需的。在我看来，无论如何我都不会担心w3c验证工具会说些什么。只要你在必要的浏览器中测试它就可以了。

＆＃34;元素img上属性src的值不正确：必须为非空＆＃34;，用于动态生成的img src

2 个答案: