是否可以使用JavaScript处理HTML文档中嵌入的SVG文档?

编程入门 行业动态 更新时间:2024-10-24 13:27:09
本文介绍了是否可以使用JavaScript处理HTML文档中嵌入的SVG文档?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我已经制作了一个SVG图像,或者更像是迷你应用程序,用于查看数据图形。我想将它包含在HTML页面中,并调用SVG图像上的方法。

示例:

< object id =imgdata =image.svgwidth =500height =300/> < script> document.getElementById(img)。addData([1,23,4]);< / script>

完全可以在SVG文档上调用方法吗?如果是这样,我该如何声明在SVG文件中公开的方法,以及如何从HTML文档中调用它们?

解决方案

解决方案:

svg:

< script> document.method = function(){}< / script>

在html中(使用原型添加事件侦听器):

< script> $(img)。observe(load,function(){$(img)。contentDocument.method()});

您需要监听图像上的加载事件。加载图像后,您可以使用 element.contentDocument 访问svg文档上的文档变量。任何添加到该方法的方法都将可用。

I have made a SVG image, or more like mini application, for viewing graphs of data. I want to include this in a HTML page, and call methods on the SVG image.

Example:

<object id="img" data="image.svg" width="500" height="300"/> <script>document.getElementById("img").addData([1,23,4]);</script>

Is it at all possible to call methods on the SVG document? If so, how do I declare the methods to expose in the SVG file, and how do I call them from the HTML document?

解决方案

Solution:

in svg:

<script>document.method = function() {}</script>

in html (using prototype to add event listeners):

<script>$("img").observe("load", function() {$("img").contentDocument.method()});

You need to listen to the load event on the image. Once the image is loaded, you can use the element.contentDocument to access the document variable on the svg document. Any methods added to that, will be available.

更多推荐

是否可以使用JavaScript处理HTML文档中嵌入的SVG文档?

本文发布于:2023-05-27 09:57:37,感谢您对本站的认可!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:文档   可以使用   HTML   JavaScript   SVG

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!