Tabulator init 中的元素 instanceof HTMLDivelement 为 false

Question

我想在旧版 GWT 应用程序中使用 Tabulator。

我正在从本机 JS（GWT 的 ScriptInjector 中包含的文件）创建 Tabulator。这是我的代码：

      const table = new Tabulator($(".tabulatordiv_id")[0], {
        data:tabledata, //assign data to table
        layout:"fitColumns", //fit columns to width of table (optional)
        columns: [{title:"Name", field:"name"}]
      });

我收到错误：“制表符创建错误 - 提供的元素无效”。

我查看了 Tabulator，发现它停在这里：

Tabulator.prototype.initializeElement = function (element) {
    if (typeof HTMLElement !== "undefined" && element instanceof HTMLElement) {
        this.element = element;
        return true;
    } else if (typeof element === "string") {
        this.element = document.querySelector(element);
        if (this.element) {
            return true;
        } else {
            console.error("Tabulator Creation Error - no element found matching selector: ", element);
            return false;
        }
    } else {
        console.error("Tabulator Creation Error - Invalid element provided:", element);
        return false;
    }
};

因为“元素 instanceof HTMLElement”为 FALSE。

我从遗留应用程序中提取页面并使其尽可能与原始页面相似（提取相同的 js 库，提取 GWT js 文件等）以重现问题，但失败了。我无法在旧版应用程序之外复制它。

但是，如果我将 Tabulator.js 中的 init 更改为更宽松一点，如下所示：

//      if (typeof HTMLElement !== "undefined" && element instanceof HTMLElement) {
        if (typeof HTMLElement !== "undefined" && typeof element !== "string") {
        this.element = element;

然后就可以了。

我很确定我传递给 Tabulator 的是一个 HTMLElement（在浏览器中双重检查，具有 HTMLElement 应具有的所有属性）。

所以我想问一下“instanceof HTMLElement”检查的主要内容是什么？如果我绕过 Tabulator init 中的检查，我以后运行遇到麻烦的可能性有多大？

Answer 1

您似乎在其中传递了一个冗余的 jquery 选择器。您也可以直接将选择器查询字符串传递给 Tabulator 并让它为您找到元素：

 const table = new Tabulator($(".tabulatordiv_id")[0], {

应该是

 const table = new Tabulator(".tabulatordiv_id", {

Answer 2

如果使用得当，Tabulator.js 在我们的应用程序中可以正常工作。我现在无法重现原来的问题。

但是要小心我 post 中的“更宽松”的初始化。如果将“未定义”元素传递给 Tabulator，它不会失败，但当然会导致稍后在 rtlCheck 中失败。

Tabulator init 中的元素 instanceof HTMLDivelement 为 false

element instanceof HTMLDivelement is false in Tabulator init

html

javascript

gwt

tabulator