将ID属性添加到Web应用程序的所有HTML元素？ [英] Adding ID attribute to all HTML elements of a web application?

问题描述

目前我正在使用RoR，MySQL，HTML，CSS和jQuery等构建Web门户，我收到了自动化测试工程师的请求，要求将ID属性（如果可能还有NAME属性）添加到我的应用程序的所有元素中。

Currently I am building a web portal using RoR, MySQL, HTML, CSS and jQuery etc., I got a request from my automation test engineer to add ID attributes(if possible NAME attribute also) to all the elements of my application.

我很困惑这样做或许我不确定这是否是一个好的做法，所以任何人都可以通过添加ID帮助我解决具体的缺点/问题属性到我的应用程序的所有元素。

I am confused to do this perhaps I am not sure whether it is a good practice or not, so can anybody please help me with specific disadvantages/issues with adding ID attributes to all elements of my application.

谢谢，

西瓦

Thanks,
Siva

推荐答案

要进行可靠的前端测试，您需要能够识别某些元素而不使用过度特定的选择器（如果没有参考元素，则需要这些选择器）。一个选择器，如 body div：nth-​​of-type（4）ul li：nth-​​child（5）a 来检查某个链接不仅显然是丑陋的，而且还容易发生标记的变化。一个小的改变可能会打破你的一半测试。为了避免这种情况，有几种方法可以让您的测试工程师的生活更轻松：

To do reliable frontend tests, you need to be able to identify certain elements without using overly specific selectors (which you need, if you have no reference elements). A selector like body div:nth-of-type(4) ul li:nth-child(5) a to check a certain link is not only obviously ugly, but also prone to changes in the markup. A small change could break half of your testsuite. To avoid this, there are several ways to make your test engineer's life easier:

将 id 分配给所有页面元素......

would be to assign ids to all your page elements...

是以下方法：

1. 使用新的语义标签，例如 < nav> ， < header> ， < footer> ， < main> ， < section> 。
   
   使用这些元素，您可以构建页面的基本结构。


2. 将 id 分配给重要/唯一页面元素。谨慎使用它们，使用有意义的名称，并记住 id s代表唯一元素（可能只在页面上出现一次）！


3. 使用类属性对具有相似特征的多个元素进行分组（例如导航元素，外部/内部锚点，交互元素......）


4. 避免 name 属性，或仅在必要时使用。 HTML5在某些元素上弃用了此属性，例如< a> ，因此我会完全避免使用它。没有必要考虑你拥有的所有其他选项。

1. Make use of the new semantic tags like <nav>, <header>, <footer>, <main>, and <section>.
   With these elements you can build the basic structure of your page.
2. Assign ids to important/unique page elements. Use them sparingly, use meaningful names and keep in mind that ids represent unique elements (may only occur once on the page)!
3. Use the class attribute to group more than one elements with similar characteristics (for example navigation elements, external/internal anchors, interaction elements,...)
4. Avoid name attributes, or use only if necessary. HTML5 deprecated this attribute on certain elements like the <a>, so I would avoid it altogether. It's not necessary considering all the other options you have.

最后，你应该与你的测试工程师进行一对编程会议以获得一个更好的感觉，他的需求是什么，所以你不要用无用的标记贴上页面。

Finally, you should have a pair programming session with your test engineer to get a better feeling, what his needs are, so you don't plaster the page with useless markup.

这篇关于将ID属性添加到Web应用程序的所有HTML元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！