将外部 SVG 文件加载到变量中并附加到 html

2023-12-12

我正在尝试用该 SVG 的内容替换嵌入 IMG 标签中的 SVG 图像,并将其内联输出。换句话说,将给定 IMG SRC 属性的 SVG 文件内容加载到变量中,并将其作为内联 SVG 注入 HTML,如下所示:

...

else if (type && type === 'img-simple') {
    if (format === 'svg' ) {
         $.get(src, function(data) {
         var svg = $(data);
         $bg.append(svg);
    });

} else {

...

其中 var type 是图像类别,format 是图像类型:jpg、sag 等。

这给了我以下错误:

[Error] Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin. (img01.svg, line 0)
[Error] XMLHttpRequest cannot load file:///Users/img01.svg. Origin null is not allowed by Access-Control-Allow-Origin. (index.html, line 0)

显然是 get 函数的问题?

提前致谢


您无法使用 ajax 加载数据file://协议。你需要使用http://

例如,将 svg 文件移动到与 javascript 文件相同的文件夹,然后执行以下操作:

$.get('img01.svg', function(data) {
    $bg.append(data);
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将外部 SVG 文件加载到变量中并附加到 html 的相关文章

随机推荐

  • Angular2中如何获取GET参数?

    通过访问myproject dev people filter 5Bindustry 5D finance filter 5BstartWith 5D a Angular2将url指向myproject dev people 这是我的路线配
  • 这是在 java 中将 FocusListener 添加到 JTextFields 的正确方法吗?

    我有数百个JTextFields在我的 Java 应用程序中 我想添加FocusListener对所有这些设置水平对齐方式的文本和添加焦点监听器在每个文本字段上 所以 我做了这个方法 而且效果很好 但我只是想知道这种方法是否正确 或者有什么
  • 使用 sed 的追加/更改/插入而不带换行符

    我想替换 SED 中的模式空间 我可以这样做s hello world 但我可以使用c以某种方式命令 在我的 sed 脚本中不使用换行符 我并不完全清楚这是否可能 同样的问题a and i命令 如果你的 shell 是 bash 这里有一个
  • Rails:调用“id”主键方法时出现“堆栈级别太深”错误

    这是转发于另一个问题 这次隔离比较好 在我的environment rb 文件中 我更改了这一行 config time zone UTC 到这一行 config active record default timezone utc 于是乎
  • 如何在导航抽屉中的两个片段之间通信数据

    我有一个导航抽屉 其中包含不同的片段 每个项目显示一个片段 我想将数据从一个片段传递到另一个片段 我只有一个包含导航抽屉的活动 其中有一个片段列表 我尝试了很多解决方案 捆绑和意图 但我无法解决我的问题 任何人都可以帮我吗 这是我的第一个片
  • 如何在 Windows Phone 7 中使用 BinaryFormatter

    如何在 Windows Phone 7 中使用 BinaryFormatter 我用这个using System Runtime Serialization Formatters Binary在 service1 svc cs 中 但我无法
  • 使用 Windows 批处理文件从 txt 文件中仅读取 x 行

    如何从 a txt 文件中只读取 X 行 该文件包含目录的所有名称 我只想读取 x 行 X 可以是 1 到 99 之间的数字 您需要根据需要修改此设置 但下面的脚本将循环遍历文件 directories txt 并回显该行的内容 直到达到中
  • Java 中什么会引发 IOException?

    java io IOException似乎是最常见的异常类型 巧合的是 它似乎也是最模糊的 我不断看到throws IOException每当使用套接字 文件等进行编写时 我实际上从未被触发过 所以我想知道应该触发异常的是什么 该文档对于解
  • 不同实体值具有相同同义词的对话流歧义

    我在使用对话流 api ai 开发代理时遇到问题 我使用了很多彼此不同的实体值 然而 某些实体值有类似的同义词 但代理仅返回一个值 我怎样才能获得所有可能的匹配或提出问题来解决歧义 例如我有一个意图 告诉我 ABC 特快列车的位置 if m
  • Java Spring + Jersey 子资源:在运行时注入构造函数参数

    我定义了以下方法 返回一个表示子资源定位器 泽西岛 的 bean Path slug public PageResource page PathParam slug String siteSlug throws AppException s
  • 如何禁止用户在 Groovy 脚本中做坏事?

    我计划将 Groovy 脚本引擎集成到我的游戏中 这样它将为游戏提供良好的可修改性 但是如何防止玩家编写邪恶的脚本 例如删除 C 驱动器上的所有文件 Groovy 包括类似库java io File默认情况下 因此一旦他们决定编写此类脚本
  • Swift - 如何检测方向变化

    我想将两个图像添加到单个图像视图 即横向一个图像和纵向另一个图像 但我不知道如何使用快速语言检测方向变化 我尝试过这个答案 但它只需要一张图片 override func viewWillTransitionToSize size CGSi
  • 如何在 Java 中使用密码保护压缩的 Excel 文件?

    我有一个关于保护 Excel 文件的密码的问题 情况是 我有一个 zip 文件 其中有一个 Excel 文件 我需要编写一个Java程序 以密码保护Excel文件 因此 用户应该能够解压缩该文件 zip 文件不需要受密码保护 但是 Exce
  • 如何在没有 EULA 的情况下启动 ChromeDriver.exe?

    我正在学习使用 Selenium v2 20 以领先于我们的一些程序员 他们很快将用它创建一些浏览器测试 我想在陷阱出现之前发现它们 而我无意中发现了一个 当我创建 ChromeDriver 时 它总是会弹出 Google Chrome E
  • 在 AS3 中从库加载和卸载内容

    我正在做一个 Flash 项目 但我对 ActionScript 很陌生 我在主页上有一个菜单 我想在单击菜单项时显示其他页面 我知道如何从库加载影片剪辑 但我不知道如何指定它们在屏幕上的位置以及如何使它们出现在特定层中 当我点击菜单的另一
  • 如果我们启用僵尸对象,所有弱引用都会被清空吗?

    通常 如果一个对象被释放 所有弱引用都将被清空 如果我们启用僵尸对象会怎么样 产品 gt 编辑方案 gt 启用僵尸对象 弱引用也会被置零吗 否则 在启用僵尸对象时会出现正常情况下不会发生的错误 正如其中一个答案所说 我强烈怀疑弱引用将被消除
  • 如何将秒转换为小时、分钟和秒?

    我有一个以秒为单位返回信息的函数 但我需要以小时 分钟 秒的形式存储该信息 有没有一种简单的方法可以在Python中将秒转换为这种格式 您可以使用datetime timedelta功能 gt gt gt import datetime g
  • 如何让 PHP 在出现错误时生成回溯?

    尝试使用 PHP 的默认仅当前行错误消息来调试 PHP 是可怕的 当产生错误时 如何让 PHP 产生回溯 堆栈跟踪 我的用于安装生成回溯的错误处理程序的脚本
  • 加载 jasperreports 的 .jrxml 文件

    在我的项目中 我将 jrxml 文件存储在名为 com bio ofm mnu views reports jasperReports 的包中 当我尝试加载 jrxml 时出现以下错误 net sf jasperreports engine
  • 将外部 SVG 文件加载到变量中并附加到 html

    我正在尝试用该 SVG 的内容替换嵌入 IMG 标签中的 SVG 图像 并将其内联输出 换句话说 将给定 IMG SRC 属性的 SVG 文件内容加载到变量中 并将其作为内联 SVG 注入 HTML 如下所示 else if type ty