2

我在 w3c 验证器的产品视图页面中有错误

我的产品是可下载的产品。我有该产品的自定义选项在此处输入图像描述

当我在 w3c 验证器中验证测试产品页面时，它显示这样的错误

没有属性“价格”

…" id="options_21_2" value="27" price="0" />

错误行：

<ul id="options-21-list" class="options-list"><li><input type="checkbox" class="checkbox product-custom-option" onclick="opConfig.reloadPrice()" name="options[21][]" id="options_21_2" value="27" price="0" /><span class="label"><label for="options_21_2">Test Product</label></span></li></ul>

帮助解决这个问题。

4

1 回答 1

1

背景

这里的问题是，这price是一个自定义属性。即使几乎所有浏览器都可以按照您发布它的方式通过 JavaScript 使用它，但它不是一个有效的 (X)HTML 属性，例如id或者name是。

<!DOCTYPE .. >W3C 验证器根据文档声明中的 DTD（文档类型定义）验证您的源代码 。

Magento CE/EE 1.x 版本默认使用XHTML 1.0 Strict DTD。

DTD 声明文档必须遵循哪些规则才能对给定的文档类型有效。它定义了允许哪些元素类型、特定元素可以具有哪些属性、可以使用哪些实体等。

如果您检查上面链接的 DTD，您会看到price文件中的任何位置都没有定义属性。

这就是 W3C 验证器正确地抱怨的原因.. there is no attribute "price"。

你能做什么？

关于如何处理这种情况，我主要想到以下三点：

仔细检查后忽略

您可以简单地忽略这种（并且只有这种）特定类型的 W3C 验证错误。

我猜这就是大多数开发人员对“.. there is no attribute attr_name”验证错误所做的事情，当他们已经仔细检查时，它是一个真正在使用的自定义属性，并且只是失败了 W3C 验证（使用 HTML5 之前的 DTD），但完全可以工作否则很好。

扩展 DTD

您可以扩展 XHTML 1.0 Strict DTD，为特定元素添加自定义属性。

关于如何使用内部子集price为元素添加自定义属性的示例：input

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
[
<!ATTLIST input price CDATA #IMPLIED>
]
>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Test</title>
</head>
<body>
<p>
<input type="checkbox" class="checkbox product-custom-option" onclick="opConfig.reloadPrice()" 
name="options[21][]" id="options_21_2" value="27" price="0" />
</p>
</body>
</html>

包含这个内部子集，W3C 验证器将在没有错误的情况下进行验证。

但是]>，当内部子集发挥作用时，大多数主要浏览器都会因此呈现出丑陋的结果。

也许是因为他们不支持嵌套标签（根本不支持，或者不正确），或者他们在找到正式的 DTD 后就切换到硬连线的 DTD <!DOCTYPE .. >，我无法准确判断。

为了避免]>，您可以构建一个自定义 DTD，使用原始 DTD 作为基础，使用自定义属性扩展它并更改!<DOCTYPE .. >以使用该自定义 DTD。

使用自定义 DTD 的关键是，即使它在技术上是正确的，并且浏览器不会再呈现那么丑陋]>，你也不能再使用 W3C 验证器了。它不支持自定义 DTD。

因此，如果 W3C 合规性是必须的，那么您唯一的选择就是保留内部子集。但是你仍然需要以某种方式摆脱丑陋]>。为了实现这一点，您可以使用一些 CSS，例如与此类似：

html {
    color: transparent;
}

但请注意，扩展 DTD 可能会导致大量工作。您需要扩展您的自定义属性可能出现的所有元素类型。当然，您需要为每个自定义属性执行此操作。

使用 HTML5data-*属性

您可以重写您的 Magento 模板以使用 HTML5 及其data-*属性，您只需在自定义属性名称前加上前缀data-即可使其完全有效。

但是由于将 Magento 1.x 从 XHTML 1.0 Strict 完全转移到 HTML5 会导致大量复杂的工作，我并不认为这是一个选择。

Afaik，即使 Magento 2.x 也不会切换到 HTML5，而是继续使用 XHTML 1.0 Strict。

也许是因为同样的原因^^

于 2013-09-10T21:02:00.100 回答