はじめに
- セレクタには優先順位があり、点数計算して高得点のものが適用される
- 点数計算のやり方を以下に記述する
計算式
- 以下の点数を加算していく
| 指定方法 | 例 | 点数 |
|---|---|---|
| タグのstyle属性 | style="color: red;" | 1000点 |
| ID | #hoge | 100点 |
| クラス | .hoge | 10点 |
| 属性セレクタ | a[href*="google"] | 10点 |
| 要素名 | ul | 1点 |
| 擬似要素 | :first-child | 1点 |
| ユニバーサルセレクタ | * | 0点 |
計算例
| 例 | 計算 | 合計点 |
|---|---|---|
| style="" | 1000(style属性) | 1000点 |
| #hoge | 100(ID属性) | 100点 |
| li.color.label | 1(要素名) + 10(クラス属性) + 10(クラス属性) | 21点 |
| table tr td.color | 1(要素名) + 1(要素名) + 1(要素名) + 10(クラス属性) | 13点 |
| div + *[href$="com"] | 1(要素名) + 0(ユニバーサルセレクタ) + 10(属性セレクタ) | 11点 |
| h1 div + span | 1(要素名) + 1(要素名) + 1(要素名) | 3点 |
| li:last-child | 1(要素名) + 1(擬似要素) | 2点 |
～ただの宣伝～
- 全国のSeleniumer必読
- Seleniumerといっていますが、Selenium, SauceLabs, Travis, Jenkinsに関するノウハウ書いているのでよかったら参考にしてみてください