如何选择包含引号的元素？

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"]');`

当我写这篇文章时，至少对我来说，在 chrome 上似乎可以工作。

Answer 2

将引号替换为 &x22;

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

https://stackoverflow.com/a/15135906/4263440

Answer 3

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

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