如何通过包含引号的属性值选择元素？

Question

当元素的属性包含引号时，如何使用

querySelector

或任何其他 JavaScript 选择器

？

例如，如果我搜索一个

img

元素，其

src

为

http://www.example.com/abc"def

（是的，包含引号的属性）：

document.querySelector('img[src="http://www.example.com/abc"def"]');

出现此错误：

未捕获的 DOMException：无法在“文档”上执行“querySelector”：“img[src="http://www.example.com/abc"def"]”不是有效的选择器。

显然，我的问题适用于同时使用的单引号

和双

引号。

Answer 1

var test = document.querySelector('img[src="http://www.example.com/abc\\"def"]');`

使用

转义引号似乎有效。

Answer 2

你可以像这样使用 \ ，JS 应该识别它是字符串的一部分：

document.querySelector('img[src=\"http://www.example.com/abc\"def\"]');

Answer 3

将您的报价替换为

&x22;

:

document.querySelector('img[src="http://www.example.com/abc&x22;def&x22;]');