Question

修改元素值后，document.querySelectorAll("[value='a']")的返回值将保持不变，浏览器和javascript均未修改。

我在客户端上运行Windows 10和Chrome 73。下面是演示：

var text1 = document.getElementById("text1");
var text2 = document.getElementById("text2");
var select = document.getElementById("select");
var modify = document.getElementById("modify");

select.addEventListener("click", function () {
    console.log("text1.value: " + text1.value);
    console.log("text2.value: " + text2.value);
    console.log(document.querySelectorAll("[value='a']"));
});

modify.addEventListener("click", function () {
    text1.value = "a";
});

<input type="text" id="text1">
<input type="text" id="text2" value="a">
<input type="button" id="select" value="select">
<input type="button" id="modify" value="modify">

单击select按钮，我会在浏览器控制台中登录NodeList [input#text2]。
单击modify按钮或直接修改text1值。
单击select按钮，我得到NodeList [input#text2]，但我希望输出为NodeList(2) [input#text1, input#text2]。

类似选择器的外观仅适用于初始html值。我试过用Google搜索这个问题，但是那里没有任何线索。

如果这种行为是标准行为，目的是什么？
如果我想要期望的返回值NodeList(2) [input#text1, input#text2]，是否有解决方法？

修改元素值后，document.querySelectorAll（“ [value ='a']”）的返回值将保持不变

0 个答案: