XPath, CSS, DOM 以及Selenium: The Rosetta Stone（罗塞达石）

许多编程的惯例都可以通过图表的方式最好地表现出来。没有人会抱怨XPath或者CSS可以完全通过直觉去理解，因为它们能简洁而高效地定位层级的数据。建立一个清单式的图表还是颇有难度的。然而你却能豁然开朗，像SeleniumIED这样的app会变得容易得多。

“A little learning is a dangerous thing." [Alexander Pope, An Essay on Criticism]
浅尝辄止是非常危险的。

你是否曾被XPath、CSS或DOM所吸引并尝试着使用它们，而后有发觉自己并没有完全掌握其中所有的用法？其实，这三种技术的有着相似的目的：用一些标记来寻找所需的元素。那么就有可能把以各种技术实现的查找方式都例举出来。下面，这(XPath | CSS | DOM | Selenium)版Rosetta Stone（罗塞达石，解释古埃及象形文字的可靠线索）以及技术清单将带满足你的所有需求，并且能帮助你梳理贯通、博采众长。

XPath, CSS, 和DOM的形式看起来是多样化的，却也有着许多共同之处。它们都提供了高效的语法结构来查找元素，XPath建立在一般的XML（包括形式良好的 HTML）之上，而CSS和DOM是严格建立在HTML上的。以下的图表将展示每种技术所有查找元素的语法，另外由于它们一一对应的特点，图表给出的相互参照项能使你知其一而悉其他。

最后，图表又将细长的表项分成了多个部分，以提供Selenium的视角，更好地应用到Selenium平台上。其中高亮出为一些主要规则之外的特例。对于你的实验，一个完整的测试系列将会是个好的开始！

各人喜好不同，以下提供两个版本，风格不同而内容一致。





 


翻译自：https://www.simple-talk.com/content/article.aspx?article=1269