如何在 css/js 属性选择器 [attr=value] 中正确转义属性值?

问题描述

我应该如何在 css/js 属性选择器 [attr=value] 中转义属性?

How should I escape attributes in the css/js attibute selector [attr=value]?

具体来说，这样对吗?

document.querySelector('input[name="test[33]"]')

我正在寻找执行此操作的标准方式"(如果有的话)，因为我不希望 Sizzle 使用执行繁重的后备功能

I'm looking for the "standard way" of doing this, if any, because I don't want Sizzle using a heavy-to-execute fallback function

推荐答案

是的，这是一种正确的方法.选择器 3 级规范 声明如下:

Yes, that is one correct approach. The Selectors Level 3 specification states the following:

属性值必须是 CSS 标识符或字符串.

Attribute values must be CSS identifiers or strings.

您问题中的示例使用字符串作为属性值.标识符"定义如下:

The example in your question uses a string as the attribute value. An "identifier" is defined as follows:

在 CSS 中，标识符...只能包含字符 [a-zA-Z0-9] 和 ISO 10646 字符 U+00A0 及更高，加上连字符 (-) 和下划线 (_)；它们不能以数字、两个连字符或一个连字符后跟一个数字开头.标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码...

In CSS, identifiers... can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code...

因此，转义特殊字符并省略引号也是合法的:

So following that, it is also legal to escape the special characters and omit the quotes:

document.querySelector('input[name=test\[33\]]')

这篇关于如何在 css/js 属性选择器 [attr=value] 中正确转义属性值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！