Javascript 为什么querySelectorAll有时会返回活动DOM元素？

但是querySelectorAll，除非我遗漏了一些东西，否则并非所有属性都是这样

问题：我使用

.innerHTML

属性测试了

querySelectorAll

。它没有返回创建文档时出现的数字5，而是返回用Javascript插入的单词5。为什么会这样

作为一个控件，我使用

.length

属性测试了

querySelectorAll

，它返回了预期的数字10

关于

querySelectorAll

我肯定遗漏了一个关键概念，但我不确定那是什么。我的代码如下。非常感谢

var largeContainer=document.queryselectoral（“.box_1”）；
document.getElementsByClassName（“box_1”）[9].className=“box_2”；				
console.log（largeContainer.length）；
document.getElementsByClassName（“box_1”）[5].innerHTML=“五”；
log（largeContainer[5].innerHTML）
.box\u 1{
高度：100px；
利润率：0.16px 0；
字号：2rem；
颜色：白色；
背景色：红色；
}
.box_2{
高度：100px；
利润率：0.16px 0；
字号：2rem；
颜色：白色；
背景颜色：蓝色；
}
0
1.
2.
3.
4.
5.
6.
7.
8.
9
那么，
var largeContainer=document.queryselectoral（“.box_1”）使用类
框1
选择所有DOM元素。如果以后更改类，
largeContainer
仍然引用那些DOM元素，而不是曾经用于获取它们的选择器

而不是返回文档创建时出现的数字5
它返回插入的单词FIVE
Javascript。为什么会这样

有问题的代码获取位于的元素的
.innerHTML

console.log(largeContainer[5].innerHTML);

document.getElementsByClassName("box_1")[5].innerHTML = "FIVE";

在元素处设置
.innerHTML
之后

console.log(largeContainer[5].innerHTML);

document.getElementsByClassName("box_1")[5].innerHTML = "FIVE";

根据，它返回一个静态值是正确的，即它在安装过程中选择的元素集不会更改

但是，节点列表中的这些是对现有DOM元素（活动节点）的引用。因此，对这些元素的任何更改都将反映在后续访问中。
差异是元素及其内容之间的差异，这是因为变量
largeContainer
包含一个元素集合，您在将更改应用于类之前收集该集合。如果您在运行
.querySelectorAll（）
之前更改了
类的名称，我相信您的结果将与预期的一样。我冒昧地对您的措辞进行了一些重大更改，如果您觉得我误解了您的话，请随时回滚编辑。非常有趣，谢谢。我在这里读到了
NodeLists
。如果我正确理解了引用，则
。长度
是
节点列表的唯一属性。如果这是正确的，是否意味着
.length
是唯一保持静态的东西？嗯。。是的，如果你这么说的话。。事实上，该列表中没有添加或删除新元素引用。此外，元素引用列表中保持常量的元素。为了更好地理解，假设您有一个元素
e
，它已经在您选择的节点列表中。现在，删除/销毁元素，然后使用完全相同的属性创建元素。现在，当您尝试从该列表访问元素
e
时，您将得到错误，因为引用现在指向nothing/null。