我需要关注W3C验证吗?

31

我正在学习AngularJS,我找到了一个简单的代码,就像这个:

<!DOCTYPE html>
<html>
   <head>
    <meta charset='utf-8'>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
</head>
<body ng-app ng-init="name = 'World'">
    <h1>Hello, {{name}}!</h1>
</body>
</html>

应该关注我的应用程序是否通过W3C验证测试吗?是否应该放弃AngularJS主要是因为存在非标准属性(ng-appng-init)导致无法通过W3C验证测试。

问题是:我是否应该关注我的应用程序是否通过W3C验证?是否应该放弃AngularJS?


3
最好的JavaScript框架是 鼓声没有!因为它已经支持(惊喜!)JavaScript,所以不需要向客户端发送额外的总计字节和个HTTP请求!警告:这将要求您学习实际符合标准的JavaScript。任何Web/软件开发人员最不专业的事情之一就是本质上说,“我们如何通过添加不必要的依赖项来使我们的代码过度复杂化并削弱它,因为我们没有在应该知道的东西上下功夫?” - John
1
@John 完全同意。 - Victor - Reinstate Monica
9个回答

49

你可以使用 data- html5 属性,这是标准的,并且据我所知在 Angular 中也可以正常工作。 类似于:

你可以使用 data- html5 属性,这是标准的,并且据我所知在 Angular 中也可以正常工作。 类似于:

data-ng-app=""
data-ng-init="xxx"

在Angular中使用相同的方法,同时通过W3C进行验证。

还要看这个:ng-app与data-ng-app有什么区别?

除此之外,根据我的经验,在将产品交付给可能的大众(例如建造网站或公共网络应用程序等)时,遵循标准始终是更好的选择,因为不同客户端、版本等会产生差异。 如果您正在使用Angular构建SPA,并使用PhoneGap创建将作为本地应用程序安装在移动设备上的移动应用程序,则标准可能并不重要,重要的是它能够在目标设备上运行。


48

我是W3C HTML5验证器的维护者。我们已经讨论过如何更好地促进包含自定义属性(例如Angular的ng-*属性)的文档的验证,虽然这些属性不是标准的,但仍然非常广泛和正确地使用,因此让验证器发出有关它们的“错误”消息并没有帮助作者。

为了缓解这个问题,我在HTML5验证器中添加了一个“消息过滤”功能,使您可以持久性地忽略对您而言不重要或无用的错误/警告消息。前端在这里:

http://validator.w3.org/nu/

提交文档检查后,在结果页面上您会看到一个消息过滤按钮,如果您按下该按钮,您将获得一个错误消息分组列表,其中包含显示/隐藏复选框。请注意保留HTML标签。

validator screen shot showing Message Filtering button

更新2017-02-06: 自定义属性的HTML规范提案

我已经为自定义元素添加了支持HTML检查器(W3C验证器)-因此,要添加对自定义属性的支持,我可以使用类似于我用于实现它的机制。

但是,在HTML规范允许它们之前,HTML检查器无法更改以允许自定义属性名称。有关详细信息,请参见HTML规范问题跟踪器中的提案


1
非常好!更好的是,有一种方法可以将过滤器传递给vnu.jar https://github.com/validator/validator - tanguy_k
@sideshowbarker 有没有什么办法可以避免“致命错误:消息太多”(例如超过1000个 ng- 错误)的问题? - Kevin Sylvestre
1
@KevinSylvestre 如果你使用http://validator.w3.org/nu/,那么没有办法覆盖它,但是如果你使用`vnu.jar`文件并像这样运行它`java -Dnu.validator.messages.limit=XXXXX ~/vnu.jar some-document-with-a-lot-of-errors.html(其中XXXX是某个数字),则可以覆盖。有关vnu.jar`文件的详细信息,请参见https://validator.github.io/validator/,要下载它,请转到https://github.com/validator/validator/releases/latest。 - sideshowbarker
请勿返回任何内容。验证器本身比Vue、Angular以及谁知道下周会出现什么新的东西更有价值。另外,我完全同意Marat-Tanalin关于下划线或破折号前缀属性的偏好,这是通用的、非歧视性的和易于实现的。 - Victor - Reinstate Monica
最新的Angular 4怎么样?由于有新的属性如(click)和[pattern]等附加到输入,我们如何验证HTML呢? - Parth Doshi
1
@tanguy_k 现在可以实现,无论您是使用 CLI 版本还是设置自己的 vnu.jar 服务器:https://dev59.com/AFkS5IYBdhLWcg3wvI60#52402947 - phk

5

4
HTML约定旨在帮助防止反模式并保持代码可维护性。
是的。沿着这些方向,我最近在HTML5验证器的“关于”部分中添加了一个“为什么验证?”节,详细讨论了这个问题。

http://validator.w3.org/nu/about.html#why-validate

该部分的文本源代码在此处:

https://github.com/validator/validator/blob/master/site/nu-about.html#L160

欢迎提交具有改进/添加建议的拉取请求。

目前我拥有的是这个:

通过符合性检查器运行您的HTML文档的核心原因很简单:捕捉无意中的错误 - 您可能会忽略的错误,以便您可以修复它们。除此之外,HTML规范中的一些文档符合性要求(有效性规则)旨在帮助您和文档用户避免某些潜在问题。为了解释这些要求的基本原理,HTML规范包含以下两个部分:
- 语法级别错误的基本原理
- 内容模型和属性值限制的基本原理
总结这两个部分所述的内容:
- 有一些标记案例被定义为错误,因为它们可能对可访问性、可用性、互操作性、安全性或可维护性造成潜在问题 - 或者因为它们可能导致性能不佳,或者可能导致脚本出现难以排除的故障。
- 除此之外,还有一些标记案例被定义为错误,因为它们可能导致您在HTML解析和错误处理行为方面遇到潜在问题 - 因此,您最终可能会在DOM中得到一些不直观的、意外的结果。
验证您的文档会提醒您这些潜在问题。

2
在你的 angular 应用程序中使用前缀 "data-"。 例如:
<body data-ng-app data-ng-init="name = 'World'">
   <h1>Hello, {{name}}!</h1>
</body>

在Angular 4中怎么样添加"data-"呢? - Parth Doshi

2
您可以使用npm进行安装:
$ npm install --save-dev gulp-angular-htmlify

2

-2

尝试在安全域上使用https运行脚本:

请参考下面的内容,使用https:

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
</head>
<body ng-app ng-init="name = 'World'">
    <h1>Hello, {{name}}!</h1>
</body>
</html>

-2

这取决于您的项目大小。

通常,HTML约定旨在帮助防止反模式并保持代码可维护性。

我个人认为,那个规则(要求标签以-data为前缀才能成为有效属性)有点多余,因为它往往会促进没有任何用途的额外标记。

如果您正在处理具有许多开发人员的大型项目,请遵循WC3约定验证您的HTML。否则,没有真正的优势。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接