<ui-select> </ui-select>的W3C验证

时间:2015-02-13 20:52:30

标签: html angularjs w3c-validation ui-select

我在网站中使用angular-ui-select,其中样式化的选择字段配置了名为ui-select的自有标记。这很有效,但执行W3C validation会导致此错误:

  

在此上下文中,元素ui-select不允许作为元素div的子元素。 (抑制此子树中的更多错误。)

这是一个示例代码:

<!doctype html>
<html lang="en">
<head><title>x</title></head>
<body>
 <div>
  <ui-select></ui-select>
 </div>
</body></html>

我知道<ui-select>不会出现在那里,但我怎样才能更好地处理这个问题?

我可以将其包装到其他标记中,还是针对ui-select采用不同的方法而不是使用HTML标记?

3 个答案:

答案 0 :(得分:15)

这里是W3C HTML5验证器维护者。关于验证器行为的简短回答是,验证器将为您在文档中使用的任何自定义元素发出错误,并且目前您无法做到这一点,因为用户可以解决它那个 - 并且它会继续这种方式持续一段时间,直到我们找到解决方案。

我们正在讨论如何解决这个问题。更改验证器只是忽略带有连字符的任何元素名称作为一个完整的解决方案是不可行的,因为这样做的结果是我们不能实际检查它可能具有的任何子元素 - 我们只需要忽略整个子树,因为否则会导致其他错误。因此,这不是一个理想的解决方案。

无论如何,我喜欢找到解决这个问题的好方法,所以如果其他人有想法我想听听他们。关于这方面提出想法/建议的两个好地方是public-webapps@w3.org邮件列表https://lists.w3.org/Archives/Public/public-webapps/和whatwg@whatwg.org邮件列表https://whatwg.org/mailing-list#specs

我自己想到的一个想法是,我们可以让验证者以与当前处理<div>元素相同的方式处理所有自定义元素(就其所允许的位置而言)在文档中以及允许包含的子元素。这还不够理想,但至少它会提供一种方法来检查自定义元素子树中后代元素的错误。


更新2017-02-06:W3C HTML Checker现在支持自定义元素

所以,I added support for custom elements在2016-12-16和W3C HTML Checker之后refined it to do more detailed checking for prohibited names.(验证人)see the proposal being discussed in the HTML-spec issue tracker

我最终试图在checker体系结构中实现它 - 它的核心是一个基于RelaxNG语法/模式的验证器 - 是添加一个预处理过滤器,它采用任何带有连字符的元素。元素名称,并将它们放在单独的XML名称空间中。

然后我更新了RelaxNG模式,以允许来自该XML命名空间的任何元素。 (这很具有讽刺意味,因为我非常讨厌XML命名空间及其导致的所有问题。)

所以我们现在正在寻找类似于custom- 属性名称的东西 - 可能只是将它们定义为包含连字符的任何属性名称(如自定义元素名称)。

但是,在更新HTML规范以允许HTML规范之前,无法更改HTML检查器以允许自定义属性名称。为此,{{3}}。

答案 1 :(得分:5)

这确实是AngularJS的一个众所周知的问题。

你可以做的一些事情:

您可以使用<ui-select>而不是使用元素<div ui-select>,但这仍然会在参数上失败。

前缀为x-data-的参数会通过,但我不确定ui-select是否支持。

HTML W3C验证非常有用,但我认为对HTML电子邮件来说非常重要,因此它们不会被筛选为垃圾邮件。它对搜索引擎也有好处,但实际上并非 至关重要。

如果你看'why validate',原因主要是清洁,调试方便和整体良好做法。

Angular(un?)幸运地扩展了HTML5的可能性领域,当然,这种方式偏离了最新的HTML规范。

答案 2 :(得分:0)

使用Knockout自定义组件我们遇到了同样的问题。 http://knockoutjs.com/documentation/component-overview.html

我添加了一个建议如何为想要使用自定义元素的用户增强验证器,即使规范尚未最终(http://w3c.github.io/webcomponents/spec/custom/#custom-tag-example):

https://github.com/validator/validator/issues/94