Javascript 查询选择器字符串与预期的模式不匹配答案

【问题标题】：Javascript query selector The string did not match the expected patternJavascript 查询选择器字符串与预期的模式不匹配
【发布时间】：2021-09-24 18:04:10
【问题描述】：

我正在尝试传递复选框的值只有如果它被选中，我正在使用文本输入。我遇到了语法问题。我看不到我错过了任何括号或任何东西。任何帮助表示赞赏。小提琴也在这里

谢谢

document.querySelector(function() {
    setTarget();
    document.querySelector("#test").change(setTarget);
 

    function setTarget() {
         var tmp ="";
        
        tmp += document.querySelector("#test:checked").value || '';
        document.querySelector('#testtarget').val(tmp);
    }
});

<input type="checkbox" id="test" name="test123" value="testing123"  />this should appear in the text input<br/>
<input type="text" id="testtarget" name="targetTextField" size="31" tabindex="0" maxlength="99" value="">

【问题讨论】：

您不能将函数传递给document.querySelector，它必须是字符串。 developer.mozilla.org/en-US/docs/Web/API/Document/querySelector 。我不清楚你这样做是为了达到什么目的。
querySelector 仅接收字符串作为参数，因此这是一个明显的语法错误，我无法理解您为什么在 querySelector 中创建匿名函数？即使允许，这也是一种非常糟糕的做法
@AmirRahman 实际上，只要返回字符串，您就可以将任何内容传递给 querySelector，没关系。虽然这是一种不好的做法和反选择，但只是想提请您注意 JavaScript 对吗？？？？。
@Emmanuel Onah 我从来没有说过你不能通过，我说过recieves 只是字符串和上面的代码，它是该选择器内的一个匿名函数，如果你在传递之前解决任何问题，还有一件事一个函数它不被认为是传递，而是它在传递之前解析

标签： javascript html

【解决方案1】：

要选择选中的复选框，您可以将:checked 与您的 querySelector 一起使用以这种方式使用它

document.querySelectorAll("input[type=checkbox]:checked")

如果我没记错的话，这正是你想要的

var cb = document.querySelector("#test"),
    inp = document.querySelector("#testtarget")
    
cb.onchange = function(e){
   inp.value = cb.checked ? cb.value : ""
}

<input type="checkbox" id="test" name="test123" value="testing123"  />this should appear in the text input<br/>
<input type="text" id="testtarget" name="targetTextField" size="31" tabindex="0" maxlength="99" value="">

【讨论】：

我明白了，在这种情况下，我试图定位一个特定的框，因此是 id，然后只有选中该复选框，然后将该值传递给文本输入。
@Michael C. 我已经更新了我的答案，看看它是否如您所愿？