querySelectorAll 返回包含 :not(class) 的所有元素

Question

注意：我只接受纯 js 答案，不接受 jquery 或任何其他 js 库。

我有一个附加到选择器的 onchange 方法

const filter = (element) => {
    const value = document.getElementById(element).value;

    elements = document.querySelectorAll("table:not("+value+")");

    console.log(value, elements, "table:not("+value+")");
}

我们得到元素的值，在这种情况下可能有两个选项： is-room-type-false和is-room-type-true 。 这些类附加到页面上的每个表（可能有数百个）当我运行它并获取console.log

我懂了：

is-room-type-true // Selected value
8200 tables, node list. // The list of elements that supposedly do not contain this class.

检查巨型阵列向我展示了：

0: table.is-room-type-false.venue-id-1
1: table // Child should not be here
2: table .... (repeats for children tables) // none of these should be here.
x (some number later): table.is-room-type-true.venue-id-1 // Should not be here  ...

我想知道是不是因为附在表上的第二类（？）

这些表可以有嵌套表，所以我只需要返回父表（如果可能），而不是它们的子表。

此外，你可以从样品输出看，我的价值是is-room-type-true ，但我们可以看到我不仅让孩子们回来了，而且还与有关类别表时，我特别声明：带出这个表班级。

所以问题是：

1. 我的 JS 函数有什么问题让我返回每个表，包括应用了类的表。
2. 如何查询以便我的节点列表只显示父表？ （如果可能的话）

我们的想法是然后将这些没有选择的类的表隐藏起来：

    [].forEach.call(document.querySelectorAll("table:not("+value+")"), function (el) {
        el.style.visibility = 'hidden';
    });

但是如果我将这段代码添加到上面的函数中，所有的表都会隐藏（这是错误的）

想法？

Answer 1

"table:not("+value+")"需要是"table:not(."+value+")"以便将value视为类名。