为什么我不能在 .querySelector 函数的选择器中使用变量？

【问题标题】：Why can't I use a variable in the selector of the .querySelector function?为什么我不能在 .querySelector 函数的选择器中使用变量？
【发布时间】：2023-04-02 19:50:01
【问题描述】：

let x = 1;
let y = 'div[class = "log-viewer"] > p:nth-child(' + x.toString() + ')';
let var1 = document.querySelector(y);

当我这样做时，var1 = null。这让我很困惑，因为如果我将 y 中包含的字符串输入到 .querySelector 函数中，我会收到适当的输出。有人知道为什么吗？我的最终目标是能够将 querySelector 放入一个循环中，这样我就可以将每个孩子放入一个数组中。

【问题讨论】：

您能否提供一个这样的查询应该匹配的 HTML 代码示例？
这行得通。如果没有，那不是因为选择器——还有其他问题。
您好，感谢您的快速回复。给你：01:51 "TQ @ aYdtgLqIEQ" 加注 300
我通过使用 document.querySelector('div[class= "log-viewer"] > p:nth-child(1)').innerHTML; 得到了这个

标签： javascript node.js jquery-selectors puppeteer

【解决方案1】：

我认为查询和页面可能有问题。

如果你点击蓝色按钮运行代码 sn-p 你会看到你的代码可以工作

let x = 1;
let y = 'div[class = "log-viewer"] > p:nth-child(' + x.toString() + ')';
let var1 = document.querySelector(y);
console.log('here is the value', var1 && var1.innerText)

<body>
  <div class="log-viewer">
  <p>p1</p>
  <p>p2</p>
  </div>
</body>

【讨论】：

非常感谢您抽出宝贵时间来做这件事。我的代码现在可以工作了（我不确定我做了什么，但它现在一直在工作）。我收到的错误消息实际上与 querySelector 函数无关——当我使用 query.Selector(y) 而不是文字选择器时，我的代码的另一部分超时。我不确定发生了什么变化，因此它不再超时 - 但我现在已经多次运行它并且它一直在运行。
抱歉含糊不清，这是我的第一个个人编码项目，我仍在学习中