为什么querySelectorAll（'；div'；）返回HtmlLevel的列表，而querySelectorAll（'；div.className'；）返回TypeScript中元素的列表

我想知道为什么当您将类名放入QuerySelector时，所有类型都不再显示为HtmlLevel

document.querySelectorAll('div').forEach(item => {
    // item type is HTMLDivElement
});

document.querySelectorAll('div.className').forEach(item => {
    // item type is Element not HTMLDivElement
});

这意味着，如果要更改样式，则会出现错误：

document.querySelectorAll('div').forEach(item => {
    item.style.display = 'none';
});

document.querySelectorAll('div.className').forEach(item => {
    item.style.display = 'none'; // TS2339: Property 'style' does not exist on type 'Element'.
});

我已经找到了一些解决方法（见下文），但我很好奇为什么它是必要的

// Cast all items in NodeList to HTMLDivElement type
document.querySelectorAll<HTMLDivElement>('div.className').forEach(item => {
    item.style.display = 'none';
});

// Cast current item to HTMLDivElement type
document.querySelectorAll('div.className').forEach(item => {
    (item as HTMLDivElement).style.display = 'none';
});

// Only change style.display if instanceof HTMLDivElement
document.querySelectorAll('div.className').forEach(item => {
    if (item instanceof HTMLDivElement) item.style.display = 'none';
});

//将NodeList中的所有项强制转换为htmldevelment类型
document.querySelectorAll（'div.className'）.forEach（item=>{
item.style.display='none'；
});
//将当前项强制转换为HtmlLevel类型
document.querySelectorAll（'div.className'）.forEach（item=>{
（项目名为HtmlDevice）.style.display='none'；
});
//仅当HtmlDiscovery实例为时更改style.display
document.querySelectorAll（'div.className'）.forEach（item=>{
if（htmldevelment的项目实例）item.style.display='none'；
});

定义如下：

（永久链接到当前版本，以防以后移动：）

看起来，它们对已知的HTML和SVG元素有专门的定义，在这些情况下会返回一个更具体的列表。我会说你的

document.querySelectorAll（'div.className'）

是其他情况下的正确解决方案