css 选择器 选择数字开头或特殊字符开头的class和id

问题背景：

HTML5之前，class和id的命名是不支持以数字开头的，但从HTML5开始就支持了。

然而css中有效的类名需要满足以下条件：

• 有效名称应以下划线 (_)、连字符 (-) 或字母 (a-z)/(A-Z) 开头，后跟任何数字、连字符、下划线、字母。
• 不能以数字开头
• 名称的长度至少应为两个字符
• 不能以两个连字符或连字符后跟数字开头

解决办法：

假设我们要选择：

<a class='3-d'>

css提供了一种叫做规避（escape）的写法,可以实现数字开头命名的选择：

1. 首先获取字符的十六进制转码数，以3为例：

python：

hex(ord('3'))
#输出 '0x33'

js:

console.log('3'.charCodeAt().toString(16)); // 输出 33

2. 构造选择器，有两种方法

（1）斜杠（\）十六进制转码数加空格：.\33 -d

  (2)   斜杠（\）加四个0,加十六进制转码数：.\000033-d （个人喜欢用这种方法）

例：

ele.query_selector(".\\33 -d")# 要转义，所以多加一个斜杠
ele.query_selector(".\\000033-d")# 要转义，所以多加一个斜杠

参考：

https://medium.com/front-end-weekly/css-selector-for-element-which-have-numbers-as-class-name-b6a089989199

CSS Syntax Module Level 3

Which characters are valid in CSS class names/selectors? - GeeksforGeeks