重新初始化SVGweb for ajax

发布时间：2020-12-16 03:12:38 所属栏目：百科来源：网络整理

导读：当简单地加载(打开)页面时,我没有使用SVGweb的问题. 如何重新初始化SVGweb以重绘页面上的所有SVG？另外我需要SVGweb来重新扫描和重新呈现页面上的所有内容. 来源(由此)： script type="image/svg+xml" svg ... /svg/script 对此(就像SVGweb si那样只需打开

当简单地加载(打开)页面时,我没有使用SVGweb的问题.

如何重新初始化SVGweb以重绘页面上的所有SVG？

另外我需要SVGweb来重新扫描和重新呈现页面上的所有内容.

来源(由此)：

<script type="image/svg+xml">
  <svg>
    ...
  </svg>
</script>

对此(就像SVGweb si那样只需打开页面)：

<svg>
...
</svg>

我需要这个,因为我使用ajax更改了SVG图形,需要在页面上重新渲染它.

我需要相同的功能,并在不修改svgweb源或手动调用_onDOMContentLoaded()处理程序的情况下想出如何正确执行此操作.实际上,它本身就受到支持.

诀窍是使用window.svgweb.appendChild()将您的SVG元素(重新)附加到DOM,这导致节点由svgweb处理,如documented within the svgweb manual所示.

例如,使用jQuery：

// Iterate over all script elements whose type attribute has a value of "image/svg+xml".
jQuery('body').find('script[type="image/svg+xml"]').each(function () {
    // Wrap "this" (script DOM node) in a jQuery object.
    var $this = jQuery(this);
    // Now we use svgweb's appendChild method. The first argument is our new SVG element
    //  we create with jQuery from the inner text of the script element. The second
    //  argument is the parent node we are attaching to -- in this case we want to attach
    //  to the script element's parent,making it a sibling.
    window.svgweb.appendChild(jQuery($this.text())[0],$this.parent()[0]);
    // Now we can remove the script element from the DOM and destroy it.
    $this.remove();
});

为了使其正常工作,我建议使用专用div包装所有SVG脚本标记,以便在附加SVG元素时将其附加到不包含其他节点的父元素.这消除了在该过程中无意中重新排序节点的可能性.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!