目标：querySelectorAll("[data-something=${variableValue}]")

【问题标题】：Goal: querySelectorAll("[data-something=${variableValue}]")目标：querySelectorAll("[data-something=${variableValue}]")
【发布时间】：2018-03-25 09:20:55
【问题描述】：

我想要实现的是从外部变量动态生成数据集值，而不是将其硬编码到 querySelector 中？

【问题讨论】：

querySelectorAll(`[data-something="${variableValue}"]`)?
@Amadan Backtick 字符串并非在每个浏览器中都有效，即使它们有效，当variableValue 包含" 时也会中断。

标签： javascript dom jquery-selectors

【解决方案1】：

只需构建字符串 - 但不要忘记正确转义它。

querySelectorAll("[data-something=" + CSS.escape(variableValue) + "]")

CSS.escape() 是一个辅助函数，用于转义所有在 CSS 中具有特殊含义的字符。见https://developer.mozilla.org/en-US/docs/Web/API/CSS/escape

【讨论】：

老兄，你是救命稻草！> ;)
顺便说一句。如果您的网站以出于某种原因使用 IE 的受众为目标，则该 MDN 网站上有一个用于 CSS.escape 的 polyfill。只是为了完整性而包含它，没有理由因为这样的小事而将 IE 拒之门外。