jQuery $(document).ready 和 svg-web window.onsvgload答案

【问题标题】：jQuery $(document).ready and svg-web window.onsvgloadjQuery $(document).ready 和 svg-web window.onsvgload
【发布时间】：2023-03-14 01:52:02
【问题描述】：

jQuery 当然要求一切都在里面

$(document).ready = function() {};

同样，svg-web 要求：

window.onsvgload = function() {};

有没有一种正确、优雅的方法可以将这些组合起来不会带来任何问题？

【问题讨论】：

把onsvgload的内容粘贴一下怎么样
我的整个脚本必须在页面加载（第一个）和 svg-web 加载（第二个）时运行 - 内容就是一切

标签： javascript jquery svg

【解决方案1】：

您可以绑定函数以在适当的事件上运行，如下所示：

$(function() { //shortcut for $(document).ready(function() {
  //stuff that needs the DOM to be ready
});
$(window).bind('svgload', function() {
  //SVG stuff
});

两者都用没有坏处，事实上这是适当的用法，总是使用你需要的事件，这与document.ready vs window.load没有区别，当你需要准备好图像时，不是只是 DOM。

如果重要，svgload 发生在之后 onload 在截至本答案时支持它的浏览器中，但不确定当其他浏览器支持它时是否会保持一致.

【讨论】：

谢谢，但我还是有点困惑。我应该把两者都需要的东西放在哪里？
@colinmarc: svgload 将在 DOM 准备好后触发，因为它是依赖的，如果它需要两者都将它放在 .bind('svgload') 调用中......必须设置和加载 SVG 元素那时，DOM 在那之前就准备好了。如果只需要 DOM，请坚持使用 document.ready。
这实际上给我带来了一些问题——我最终选择了我在下面发布的内容——但我会留下答案，因为你真的帮助我理解了发生了什么

【解决方案2】：

终于在“用户手册”中找到了这个：

$(document).ready(function() {
    window.addEventListener('SVGLoad', function() {
       // ready to work with SVG now
    }, false);
});

【讨论】：

这不是跨浏览器兼容的。你应该使用jquery的bind方法或者创建一个函数来决定是否使用addEventListener，attachEvent，或者设置window.onsvgload。