这个项目能做什么

svgdom 是一个简单直接的 DOM 实现,旨在让 SVG.js 在 Node.js 上以无头方式运行。尽管它最初就是为此目的而构建的,但如今功能已更加完整,任何需要 XML、SVG 或 HTML DOM 的人都可以使用它。典型用途包括在服务器上生成 SVG 文件、在没有浏览器的情况下测试 SVG 代码,以及构建用于检查或转换 SVG 几何图形的资源流水线工具。 开始使用 SVG.js v3.x 需要安装 @svgdotjs/svg.js 和 svgdom。你从 svgdom 导入 createSVGWindow,并从 @svgdotjs/svg.js 导入 SVG 和 registerWindow。createSVGWindow 返回一个带有 document 和 SVG 根节点的 window。注册该 window 和 document 后,你从 document.documentElement 创建画布,然后照常使用 SVG.js,例如绘制一个矩形、填充它、移动它,然后将 SVG 输出为字符串或通过 outerHTML 输出。 除 SVG 之外,svgdom 还可以用 createHTMLWindow 创建 HTML 窗口,或用 createWindow 创建通用 XML 窗口,传入命名空间 URI 和根节点,例如 MathML。在 Node.js 22.13 或更新版本上,svgdom 可以直接以 CommonJS 模块通过 require 加载。 该项目记录了有意为之的 DOM 偏差。它倾向于为无头 SVG 使用提供一个小巧、便捷的 API,而不是完全符合浏览器 DOM 规范。document.createElement 会继承 document 的命名空间,因此 createSVGDocument().createElement('rect') 会在 SVG 命名空间中创建一个 SVGRectElement,这与浏览器 XML DOM 不同——在后者中 createElement 创建的元素没有命名空间,必须使用 createElementNS。HTML 行为根据 document 的命名空间推断:具有 XHTML 命名空间的 document 会获得 HTML 名称大小写规则、不区分大小写的 HTML 类型选择器、HTML 空元素序列化,以及 HTML 对 CDATA 的限制。svgdom 目前未实现宽容的 HTML 解析算法;HTMLParser 和 innerHTML 使用严格的 XML 解析器,因此标记必须是格式良好的,不支持标签汤恢复、可选结束标签及类似行为。 对于文本边界框,必须先加载字体。当找不到指定字体对应的字体文件时,svgdom 默认加载 Open Sans-Regular。配置选项允许设置字体目录、将字体族映射到文件,以及预加载字体以避免首次使用时的加载延迟。这些函数也可以直接导入。 已知限制包括:粗体和斜体等字体属性只有在显式加载了相应字体时才受支持,例如将 Arial-italic 映射到 arial_italic.ttf。querySelector 支持有限的一组伪类:empty、first-child、last-child、nth-child、nth-last-child、first-of-type、last-of-type、nth-of-type、nth-last-of-type、only-child、only-of-type、has、is、root、not、matches、scope 和 where。nth-child 和 nth-last-child 伪类还支持 of 选择器语法。选择器中包含右方括号的属性值目前无法正确解析,即使加了引号也不行。 svgdom 可以在其他项目中使用,不过有些函数并非 SVG.js 所需,因此未实现或未测试。README 指出 childNodes 是一个数组。该项目接受针对所需功能的问题和拉取请求,并提供捐赠和赞助链接。