javascript - 有没有办法像 HTMLElement 一样扩展 SVGElement

Question

我正在制作一个小型 JS 库。我正在使用 HTMLElement 界面创建自定义元素。现在我想制作一个自定义绘图工具，为此，我希望我的元素扩展 SVGElement。
我有课图.js 它扩展了 SVGElement 和 main.js 它实例化了一个图。
这是我的课图.js :

export class Graph extends SVGElement {

    constructor() {
        super();

    }

}

和 Main.js :

import { Graph } from './Experimental/Graph/Graph.js';

customElements.define('pro-graph', Graph);

let graph = new Graph();

但由于某种原因，我收到此错误:

Uncaught TypeError: Illegal constructor.
    <anonymous> debugger eval code:1

Answer 1

问题是行 super();在你的构造函数中相当于 new SVGElement() ，当您直接调用它时会引发确切的异常。尝试这个也没有多大意义，因为没有“纯”SVGElement s。 SVGElement是更专业元素的抽象基类，如 SVGCircleElement , SVGPathElement和所有其他人。但是这些也不能通过构造函数创建。创建 SVG 元素的常用方法是通过工厂方法 document.createElementNS就像描述的 here .
当你不能通过构造函数实例化一个类时，你就不能创建一个扩展它的类。
更好的库设计方法可能是:

创建一个不扩展 SVGElement 而是在私有(private)变量

中有一个 SVGElement 的包装类

创建一个 SVGElement，然后将几个附加方法附加到它