开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

SVG getBBox函数在FireFox和Edge中返回零(但在Chrome中不返回)

SVG getBBox函数是用于获取SVG元素的边界框（bounding box）的函数。它返回一个DOMRect对象，该对象包含了元素的位置、宽度和高度等信息。

在FireFox和Edge浏览器中，getBBox函数在某些情况下可能返回零。这可能是由于浏览器的实现差异或者对某些SVG元素的支持不完善导致的。为了解决这个问题，可以尝试以下方法：

使用其他浏览器：Chrome浏览器对SVG的支持较好，getBBox函数在Chrome中正常工作。因此，可以考虑在Chrome浏览器中进行开发和测试。
使用其他方法获取元素的边界框：除了getBBox函数，还可以使用其他方法来获取SVG元素的边界框。例如，可以使用getBoundingClientRect函数来获取元素的边界框信息。
检查SVG元素的结构和属性：有时，getBBox函数返回零可能是由于SVG元素的结构或属性设置不正确导致的。可以检查SVG元素的代码，确保元素的尺寸、位置和属性设置正确。
使用其他SVG库或框架：如果getBBox函数在特定浏览器中不可用或不可靠，可以考虑使用其他SVG库或框架来处理SVG元素的边界框。例如，D3.js是一个流行的SVG库，它提供了更多的功能和跨浏览器的支持。

腾讯云相关产品和产品介绍链接地址：

腾讯云SVG图像处理服务：https://cloud.tencent.com/product/tci
腾讯云云原生应用引擎：https://cloud.tencent.com/product/tke
腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
腾讯云云数据库MySQL版：https://cloud.tencent.com/product/cdb_mysql
腾讯云音视频处理服务：https://cloud.tencent.com/product/mps
腾讯云人工智能服务：https://cloud.tencent.com/product/ai
腾讯云物联网平台：https://cloud.tencent.com/product/iotexplorer
腾讯云移动开发平台：https://cloud.tencent.com/product/mobdev
腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
腾讯云区块链服务：https://cloud.tencent.com/product/baas
腾讯云元宇宙服务：https://cloud.tencent.com/product/um

相关搜索:$window.innerHeight在chrome和firefox中返回不同的值。angular 7 http post在edge和firefox上工作，但在chrome上返回错误 HTML5视频控件在Chrome和Safari中隐藏，但在Firefox中不隐藏 Javascript在edge中不起作用，但在Firefox和Chrome中运行良好 Javascript在浏览器中返回对象，但在VSCode中不返回 JavaScript本地存储在Chrome和Edge中删除，但不在Firefox中删除 jQuery .find()不会在IE中返回数据,但会在Firefox和Chrome中返回 lighttpd SSL -在firefox/chrome中为空网站，但在IE/edge中可用 pgrep在makefile中返回true，但在shell中不返回true POST请求在C#中返回404，但在Postman中不返回

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

一篇文章完全掌握 JavaScript 数组操作

); 4// ["chrome", "firefox", "edge", "safari", "opera mini"] pop() 此方法删除数组的最后一项并返回。...1let browsers = ['chrome', 'firefox', 'edge']; 2browsers.pop(); // "edge" 3console.log(browsers); //...1let browsers = ['chrome', 'firefox', 'edge']; 2browsers.shift(); // "chrome" 3console.log(browsers);.../ ["safari", "chrome", "firefox", "edge"] 你还可以一次添加多个项目 splice() 此方法通过添加、删除和插入元素来修改数组。..."] 在 post slug 中，用连字符连接返回的数组，然后将它与类别字符串和主 url 连接到一起。

1.1K3 0

如何从浏览器中获取信用卡密码

一.写在前面的话在如今信用卡时代，信用卡盗刷案例层出不穷，作案方式也是五花八门。如中间人（MITM），恶意软件和rootkit攻击。...在研究中我们发现IE，Edge，Chrome和Firefox都存在记住密码的功能。不幸的是，他们存储敏感信息的方式都存在安全隐患。在图1中，您可以看到记住密码功能的一个示例。...将数据存储在SQLite数据库文件中％LocalAppData％ Google Chrome User Data Default Web Data Firefox将数据存储在SQLite数据库文件中...图6- API监视器，Chrome浏览器调用DPAPI CryptUnprotectData（）函数无独有偶，IE和Edge浏览器在自动填写用户表单字段时使用相同的过程。...唯一的区别是IE和Edge将他们的自动填写数据作为加密的BlobData存储在注册表中。至于Firefox，您也可以使用“DB Browser for SQLite”工具查看未加密的数据。

4.1K6 0

浏览器的自动填充功能真的安全吗？我看未必！

IE、Edge、Chrome和Firefox都会调用这种自动填充功能，但不幸的是，它们存储敏感信息的方法是存在安全问题的。...会将这些数据存储在一个SQLite数据库文件中： %LocalAppData%\Google\Chrome\UserData\Default\Web Data Firefox同样会将这些数据存储在一个SQLite...当然了，我们也有更安全的DPAPI使用方法，但在解密过程中需要用户干预，我们待会儿再讨论。 Firefox在存储自动填充数据时，完全不会对数据进行加密。...下图中，Chrome API调用了DPAPI函数- CryptUnProtectData()，参数pDataOut->pbdata指向的是返回的解密数据（信用卡号-“4916 4182 7187 7549...不同的是，IE和Edge会将自动填充数据以加密BlobData的形式随机存储在注册表键中。

1.9K6 0

跨站脚本（XSS）备忘录-2019版

throw onerror=eval,'=alert\x281\x29' 无括号，在Firefox上使用异常处理和evil {onerror=eval...\x09，\x0a，\x0d XSS 带有JavaScript协议的SVG中的Xlink命名空间 SVG使用元素Chrome/Firefox x="",alert(1)//"; 带填充零的十进制编码 IE较旧模式的行为 XSS IE中较旧版本的函数中支持的事件处理程序

6.2K1 0

Javascript数组系列二之你不了解的迭代1

Chrome Edge Firefox Internet Explorer Opera Safari Yes Yes 1.5 9 Yes Yes map 该方法对数组的每一个元素执行给定的函数，返回一个新的数组...Chrome Edge Firefox Internet Explorer Opera Safari Yes Yes 1.5 9 Yes Yes filter 该方法也是对数组的每一个元素执行给定的函数...Chrome Edge Firefox Internet Explorer Opera Safari Yes Yes 1.5 9 Yes Yes every 该方法是对数组的每一个元素执行给定的函数，...Chrome Edge Firefox Internet Explorer Opera Safari Yes Yes 1.5 9 Yes Yes some 该方法是对数组的每一个元素执行给定的函数，...Chrome Edge Firefox Internet Explorer Opera Safari Yes Yes 1.5 9 Yes Yes 可以看出 every 方法是全部返回 true 时，整个函数才返回

6034 0

ES6学习之函数传参

Firefox Internet Explorer Microsoft Edge Opera Safari 46 27 - Supported - 7.1 移动端 Chrome for Android...下面是主流浏览器对于剩余运算符的支持情况： PC端 Chrome Firefox Internet Explorer Microsoft Edge Opera Safari 47 15 - Supported...中，我们可以直接在函数声明中使用缺省参数，只有在未传递实参的情况下才会生效，不会对0和null的情况生效。...在强类型语言中，需要对参数的类型进行声明，但在javascript中缺乏这种机制，我们可以传递任意类型、任意数量的参数给函数，但在函数执行过程中如果不在使用前进行检查往往会报错，通常这不是我们想要看到的...在ES5非严格模式下，arguments对象还有一个callee属性，指向此函数，在匿名函数的回调中使用较多，不过在ES5严格模式和ES6中已经废弃，以后只能通过避免在匿名函数中实现回调。

2K10 0

探索如何将html和svg导出为图片

在chrome浏览器和opera浏览器上渲染非常正常，但是在firefox浏览器上foreignObject标签的内容完全渲染不出来：检查元素也看不出有任何问题，并且神奇的是只要在控制台元素里编辑一下嵌入的...，包括firefox、360，甚至chrome之前的版本都不行，笔者只能感叹，太难了，然后又有人建议使用上一个大版本，可以解决在firefox上的导出问题，但是笔者试了一下，在其他一些浏览器上依旧存在问题...解决foreignObject标签内容在firefox浏览器上无法显示的问题用的人多了，这个问题又有人提了出来，于是笔者又尝试看看能不能解决，之前一直认为是firefox浏览器的问题，毕竟在chrome...，在firefox浏览器上正常渲染了。...果然，在去掉了dom-to-image-more库后，重新使用之前的方式成功导出了，并且在firefox、chrome、opera、360等浏览器中都不存在问题，兼容性反而比dom-to-image-more

5812 1

ES6学习之函数传参

Firefox Internet Explorer Microsoft Edge Opera Safari 46 27 - Supported - 7.1 移动端 Chrome for Android...下面是主流浏览器对于剩余运算符的支持情况： PC端 Chrome Firefox Internet Explorer Microsoft Edge Opera Safari 47 15 - Supported...中，我们可以直接在函数声明中使用缺省参数，只有在未传递实参的情况下才会生效，不会对0和null的情况生效。...在强类型语言中，需要对参数的类型进行声明，但在javascript中缺乏这种机制，我们可以传递任意类型、任意数量的参数给函数，但在函数执行过程中如果不在使用前进行检查往往会报错，通常这不是我们想要看到的...在ES5非严格模式下，arguments对象还有一个callee属性，指向此函数，在匿名函数的回调中使用较多，不过在ES5严格模式和ES6中已经废弃，以后只能通过避免在匿名函数中实现回调。

1.6K2 0

ES6学习之函数传参

Firefox Internet Explorer Microsoft Edge Opera Safari 46 27 - Supported - 7.1 移动端 Chrome for Android...下面是主流浏览器对于剩余运算符的支持情况： PC端 Chrome Firefox Internet Explorer Microsoft Edge Opera Safari 47 15 - Supported...中，我们可以直接在函数声明中使用缺省参数，只有在未传递实参的情况下才会生效，不会对0和null的情况生效。...在强类型语言中，需要对参数的类型进行声明，但在javascript中缺乏这种机制，我们可以传递任意类型、任意数量的参数给函数，但在函数执行过程中如果不在使用前进行检查往往会报错，通常这不是我们想要看到的...在ES5非严格模式下，arguments对象还有一个callee属性，指向此函数，在匿名函数的回调中使用较多，不过在ES5严格模式和ES6中已经废弃，以后只能通过避免在匿名函数中实现回调。

1.9K2 0

DOM、BOM一些兼容性问题

而有些兼容性问题也可能是其它浏览器之间的差异，比如 Chrome 和 FireFox 对于鼠标滚轮事件对象的滚轮方向判断方式不同，Chrome使用 wheelDelta，而FireFox 则采用 detail...但在 IE 中并没有 height 和 width 这两个属性，在 Chrome 和 FireFox 中还额外有两个属性 —— x 和 y，这两个属性相对于视口坐标位置，分别表示该元素的左上角距离视口最左侧或最顶部的距离...在 JavaScript中，当一个对象被传递给期望字符串作为参数的函数中时（如 window.alert 或 document.write），对象的toString()方法会被调用，然后将返回值传给该函数...除了 Firefox 之外，都是有这么一个属性来表示：wheelDelta，它的值通常是 120 或 -120，在 Chrome 中却是 150 和 -150。向上滚动是正值，向下滚动是负值。...例如，小写“a” 或大写 “A” 将被报告为 65 在 keydown 和 keyup 中；而在 keypress 中，当按下 “Tab” 键时，会输出大写的 A “65”，不按 “Tab” 键时，按下

1.5K2 0

当代 Web 的 JSON 劫持技巧

这个问题在 FireFox 浏览器中似乎被修复了，但是我发现了一种对 Edge 进行攻击的新方式。虽然 Edge 好像是阻止分配 window....虽然命名参数不包含我们未定义的变量，但是函数的调用者是包含的！它返回了一个带有我们变量名的函数！...我试着通过检查函数的构造函数，以查看是否返回了一个不同的域（也许是 Chrome 扩展程序上下文），从而进一步利用漏洞。...> 以上内容在 Chrome 中已经不再有效，但可以当做另一个例子 UTF-16 和 UTF-16LE 看起来也很有用，因为脚本的输出看起来像是一个 JavaScript...Edge，Firefox 和 IE 在标准模式下似乎也会检查 mime 类型，Chrome 说样式表被解析了，但至少在我的测试中并不会这样。

2.4K6 0

Firefox 禁止中国用户！！

返回法律错误，这可能和 Firefox 在中国遇到的各种官司有关：屏蔽视频中的片头广告触及到了某些方面的利益，所以这类官司层出不穷。...插件不是 Firefox 开发的，和 Firefox 有什么关系？...虽然不能通过商店安装，但却可以通过其他方式，比如直接拖入安装，或者手动加载安装：所以，Chrome 在国内是不影响插件的使用的，只是不能通过商店安装而已。...再来看一下桌面浏览器的市场份额： from statcounter.com Google 的 Chrome 一家独大，其次就是 Safari、Edge、Firefox，Firefox 在这两年几乎已经跌出前三...Safari、Edge 虽然挤进前三，也只是凭借其系统内置才取得的成绩，看到遥遥领先的 Chrome 一家独大，垄断市场也并不是什么好事。

1.4K4 0

攻防|浏览器凭据获取 -- Cookies && Password

浏览器自行生成密钥，将cookie的值进行AES加密，将密文和其他信息保存到%LocalAppData%\Google\Chrome\User Data\Default\Network\Cookies中...进程pid；在进程中寻找chrome.dll的基地址和大小；通过三次特征查询定位CookieMonster 管理cookie的内存地址；在CookieMonster地址中读取每个cookie内容；...\Login Data； Chrome密钥文件路径：%LocalAppData%\Google\Chrome\User Data\Local State Edge密码文件路径：%LocalAppData...注：firefox中的masterpassword默认不设置(为空)，如果设置则需要提供masterpassword进行解密，否则会解密失败；解密过程：通过提取key4.db中的metadata表和...nss3.dll中的函数进行解密； nss3.dll调用函数： NSS_Init -- nss初始化； PK11_GetInternalKeySlot -- 获取内置的密钥槽(solt)； PK11_

3251 0

27 年 IE 终落幕，再见 IE，你好 Edge

尤其是在面对 Chrome、Firefox 等更现代的浏览器时，IE 的劣势更加明显。...2001 年，微软发布 Windows XP 操作系统，不夸张的说这应该是世界上最流行的操作系统。...3 Chrome、Firefox 异军突起，IE 辉煌不再在 IE 疲劳于修复 bug 无暇专注改善用户体验与功能更新的同时，Firefox 和 Chrome 慢慢展开了与 IE 的竞争。...之后 Chrome 并没有像 Firefox 停滞不前，而是一路开挂，先是在 2011 年底以 25.69% 的份额超越 Firefox，随后又在 2012 年的 8 月以 34.68% 的占有率完成对...4 新 Edge 获好评，但路还很长在 IE 不堪大用的同时，微软决定使用 Edge 取代 IE，但最初使用 EdgeHTML 的 Edge 体验并不算优秀，在 Chromium 内核占主导的浏览器市场

5183 0

IE 浏览器已“死”，一个时代的终结

微软承诺，至少在 2029 年之前会一直支持 Edge 中的 IE 模式。...尤其是在面对 Chrome、Firefox 等更现代的浏览器时，IE 的劣势更加明显。...2001 年，微软发布 Windows XP 操作系统，不夸张地说，这应该是世界上最流行的操作系统。...2 Chrome、Firefox 异军突起，IE 辉煌不再在 IE 疲劳于修复 bug 无暇专注改善用户体验与功能更新的同时，Firefox 和 Chrome 慢慢展开了与 IE 的竞争。...之后 Chrome 并没有像 Firefox 停滞不前，而是一路开挂，先是在 2011 年底以 25.69% 的份额超越 Firefox，随后又在 2012 年的 8 月以 34.68% 的占有率完成对

4761 0

移动端 Web 渲染解决方案

背景秋招 H5 移动端（面向微信）设计师出的落地页的动画层数有30层左右，在通过 bodymovin 导入前端页面中后再加载好素材之后仍有5秒左右黑屏渲染动画目前前端渲染有以下方案 SVG Canvas...SVG 用来定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失 PS：SVG 在IE9以及Firefox和chrome下都支持...另一种向用户提供更丰富的图形体验的方法，通过标记提供，该标记由 Apple for Safari 在 HTML5 中或在其他图形小工具中引入。...尽管考虑到观察大的示意图的有用性，但在需要细化到细节处时或者出于工程目的需要打印整个示意图时，具有可缩放性的 S 将变得足够清晰和有价值。...要保证在浏览器绘制 SVG 过程中无时滞，一个页面静态 SVG 元素大约可以绘制一万个，动态的 SVG 元素，就最好不要超过一千个。

3.5K4 0

JS 实现网页截屏五种方法

Puppeteer(chrome headless) Puppeteer是一个Node库，提供了控制chrome和chromium的API。默认运行headless模式，也支持界面运行。.../Contents/MacOS/firefox启动的是火狐默认的安装路径，因为我一开始就有火狐浏览器，所以启动的是最新版本的浏览器，然后就报错了，说不兼容。...在应用程序里面我把这个旧版本的火狐命名为Firefox59，然后这个路径就是/Applications/Firefox59.app/Contents/MacOS/firefox。...我在写例子的时候，发现的一个明显的不同就是Puppeteer截屏是异步函数，而SlimerJS截屏是同步函数？...])中的pageFunction函数里面写相应的截屏代码就可以了，因为pageFunction的执行上下文是网页上下文，所以可以获取到document等对象

7.1K3 0

前端小知识10点（2019.5.27）

mouseenter和mouseleave事件，所以需要先设置一个flag=false，在onMouseEnter时设为true，在onMouseLeave设为false，让不断触发的onMouseEnter...： border-bottom: 1px solid #d5d5d5; 5、调整 svg 中标签的位置使用标签自带的transform属性 <g transform={'translate...url ) 7、document.activeElement.tagName 返回文档中当前获得焦点的元素 console.log(document.activeElement.tagName...) （这个我以前记过，但发现工作中很少用到） 8、注意写法，在赋值的同时，判断条件 let a let b=1 if ( ( a = b )!...==-1 Edge： const isEdge = window.navigator.userAgent.indexOf('Edge') !

5781 0

IE内嵌google chrome frame解决浏览器兼容问题

参考文献： http://www.pseudowired.com/2012/12/04/tomcat-http-header-manipulation/（html中自动添加使用chrome的header.../archive/2009/03/24/1420731.html 项目背景：我们的项目中使用了highcharts和svg相关的内容，所以要求至少要IE9才可以，或者使用firefox、chrome...但是客户是国企，他们使用的都是windows自带的浏览器，普遍是IE7和IE8，有些甚至还是windows xp自带的IE6，让人倍感崩溃。...无奈执行我就只能选择以下的解决方案 var mimetype = navigator.mimeTypes["application/npclipboard

4641 0

JavaScript 将对象数组按字母顺序排序

该函数应返回负值、零值或正值，具体取决于参数，例如： function(a, b){ return a - b } sort() 方法比较两个值时，将值发送给比较函数，根据返的（负、零、正）值对值进行排序...举例：比较 40 和 100 时，sort() 方法调用比较函数(40,100)。该函数计算 40-100，并返回 -60（负值）。sort 函数会将 40 排序为小于 100 的值。...兼容性 Chrome、IE、Edge、Firefox、Safari、Opera 等都支持 sort() 方法。...，在这种情况下，我们可以使用localeCompare()函数并将其设置为在比较期间忽略标点符号。...base 来忽略字符串中存在的特殊字符，如下所示。

2344 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭