Javascript document.querySelector始终返回null_Javascript

Javascript document.querySelector始终返回null

javascript

Javascript document.querySelector始终返回null,javascript,Javascript,我看了其他答案，但还是不明白出于某种原因，这行代码总是返回null var els = document.querySelector("[id='MTG_INSTR$2']"); 我在控制台中检查了document的值，所以我很确定这是正确的身份证被深埋在桌子里，这会是个问题吗编辑2：如果有帮助，下面是完整的代码 content.js chrome.runtime.onMessage.addListener( function(request, sender, sendRes

我看了其他答案，但还是不明白

出于某种原因，这行代码总是返回null

var els = document.querySelector("[id='MTG_INSTR$2']");

我在控制台中检查了document的值，所以我很确定这是正确的

身份证被深埋在桌子里，这会是个问题吗

编辑2：如果有帮助，下面是完整的代码

content.js

chrome.runtime.onMessage.addListener(
      function(request, sender, sendResponse) {
        if( request.message === "start" ) {
         start();
             }
      }
    );

    function start(){
        var els = document.querySelector("[id='MTG_INSTR$2']");
        console.log(els);
        alert("started");
    }

popup.html

<!DOCTYPE html>
<html>
<head></head>
<script src="popup.js"></script>
<body>
<input id="button1" type=button value=clickme>
</body></html>

manifest.json

{
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
  "manifest_version": 2,
  "name": "extensiontest",
  "version": "0.2",
  "content_scripts": [
  {
    "matches": [
      "<all_urls>"
    ],
    "js": ["content.js"]
  }
],
"browser_action": {
  "default_icon": "icon.png",
    "default_popup":"popup.html"
},
//"background": {
// "scripts": ["background.js"]
//},
"permissions": [
    "tabs"
  ]
}

{
“内容安全策略”：“脚本src'self”“不安全评估”；对象src'self'，
“清单版本”：2，
“名称”：“扩展测试”，
“版本”：“0.2”，
“内容脚本”：[
{
“匹配项”：[
“
ID是专门用CSS选择器语法处理的，ID后面跟一个
，因此您通常需要类似document.querySelector（'.\MTG\u INSTR$2'）
，但$
不是合法的ID组件，因此理想情况下您应该给它起一个更好的名称。其他方法包括：
document.getElementById('MTG_INSTR$2'); // No need to change ID

也就是说，在测试中，document.querySelector（“[id='MTG\u INSTR$2']”）应该可以工作，所以您可以检查页面上是否有任何实际的id。
解决问题的可能方法
生活
DOMContentLoaded
我不知道您的完整javascript代码，但可能您是在加载脚本后创建/附加该元素或类似的内容，因此querySelector找不到具有该id的元素。如果您怀疑存在此类错误，请检查您的范围或在此处编写代码。我怀疑您的JS是否在加载标记和css之前加载。在这种情况下se，你可以尝试使用


首先加载内容，然后java脚本应该可以正常工作。
如果您想选择具有定义id的元素，请像下面的文档一样使用它。querySelector（“#MTG_INSTR$2”）这是否回答了您的问题？@Kinduser:是的，我在检查自己，它可以正常工作，即使有$
（其中querySelector
语法与$
无关）。因此我猜该页面实际上没有他们要查找的id。
document.getElementById('MTG_INSTR$2'); // No need to change ID

(function () {
  var els = document.querySelector("[id='MTG_INSTR$2']");
  console.log(els);
})();

document.addEventListener("DOMContentLoaded", function () {
  var els = document.querySelector("[id='MTG_INSTR$2']");
  console.log(els);
});