时间戳

首页 > 解决方案 > SVG获取引用的父级

javascript - SVG获取引用的父级

问题描述

我有一个<svg>元素，其中包含标记<image>下的一些元素，这些元素<defs>被一些<use>元素引用，如下所示：

    <svg xmlns="http://www.w3.org/2000/svg" ...>
      <defs>
        <image height="100%" id="test" width="100%" xlink:href="data:image/png;base64,..."/>
      </defs>
      <g transform="translate(111,222)">
        <svg height="100" width="200" x="0" y="0">
          <use xlink:href="#test"/>
        </svg>
      </g>
    </svg>

我有一个遍历 svg 元素的 javascript 函数，并且在某个点我得到了<use>. 我想要做的是从元素中获取<svg>上面的高度/宽度。<use><image>

如果尝试：

image.parentElement

我得到了<defs>元素，而不是<use>元素。

如何找到引用图像的元素？我可以尝试搜索包含的元素xlink:href="#test"，但是有没有直接的方法可以从引用的元素中获取它<image>？

抱歉这个菜鸟问题，但我是 javascript/html 的新手。

标签： javascripthtmlsvg

解决方案

不，没有办法<use>直接从元素中获取<image>元素。

推荐阅读