how to check SVG type in js

SVGSVGElement & SVGElement



svg = document.querySelector(`svg`);

// <svg class=​"icon" style=​"width:​ 100px;​ height:​ 100px;​vertical-align:​ middle;​fill:​ currentColor;​overflow:​ hidden;​" viewBox=​"0 0 1024 1024" version=​"1.1" xmlns=​"http:​/​/​www.w3.org/​2000/​svg" p-id=​"3949">​…​</svg>​

typeof svg;

// "object"

Object.prototype.toString.call(svg);

// "[object SVGSVGElement]"

svg instanceof SVGSVGElement;

// true

svg instanceof SVGElement;

// true

svg instanceof SVGAElement;

// false

svg instanceof HTMLElement;

// false


svg = document.querySelector(`svg`);

// <svg class=​"icon" style=​"width:​ 100px;​ height:​ 100px;​vertical-align:​ middle;​fill:​ currentColor;​overflow:​ hidden;​" viewBox=​"0 0 1024 1024" version=​"1.1" xmlns=​"http:​/​/​www.w3.org/​2000/​svg" p-id=​"3949">​…​</svg>​

typeof svg

// "object"

Object.prototype.toString.call(svg);

// "[object SVGSVGElement]"

svg instanceof SVGSVGElement;

// true

Web API

SVG DOM interfaces

https://developer.mozilla.org/en-US/docs/Web/API/SVGSVGElement

https://developer.mozilla.org/en-US/docs/Web/API/SVGAElement

https://developer.mozilla.org/en-US/docs/Web/API/SVGElement

SVG

https://developer.mozilla.org/en-US/docs/Glossary/SVG

https://developer.mozilla.org/en-US/docs/Web/SVG

https://developer.mozilla.org/en-US/docs/Web/SVG/Element

https://developer.mozilla.org/en-US/docs/Web/SVG/Element/svg

js type checker

https://ioliu.cn/2016/judgment-variable-type/

refs

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

how to check SVG type in js的更多相关文章

  1. 用svg+css 或者js制作打钩的动画

    之前老板让做一个登陆后 可以显示一个打钩的效果 百度死活搜不到 今天在B站看到的一个视频居然有 根据需求改进了一下废话不多说先看效果! html代码 <!DOCTYPE html> < ...

  2. CHECK MEMBER TYPE

    检查类里是否存在某种类型的几种方法,以检查xxx类型为例:方法1: template<class T> class has_member_type_Type { ]; }; templat ...

  3. input type="hidden" js获取不到值（document.getelementbyid OR $(#).val()）

    <head> <input type="hidden" name="aplStatus" id="aplStatus" v ...

  4. 最新版自动检测卡片类型工具软件版本(auto check card type v3.2.0)

    自动检测卡片类型工具软件. 卡片放到读卡器上面自动识别卡片类型,不需老是按下按钮,好用,方便.支持自动识别NTAG213卡片,NTAG215卡片, NTAG216卡片,Ultralight芯片, Ul ...

  5. Sublime Text 3配置Minify压缩,格式化css,js,html,json,svg

    1.通过 Package Control 安装Minify 按 ctrl + shift + p   输入  Install Package 然后   输入Minify  按回车就可以安装啦 2.安装 ...

  6. js data type checker

    js data type checker js 数据类型检测 "use strict"; /** * * @author xgqfrms * @license MIT * @cop ...

  7. HTML5 学习总结（四）——canvas绘图、WebGL、SVG

    一.Canvas canvas是HTML5中新增一个HTML5标签与操作canvas的javascript API,它可以实现在网页中完成动态的2D与3D图像技术.<canvas> 标记和 ...

  8. 5天揭秘js高级技术-第二天

    一.数组 1. 什么是数组? 数组就是一组数据的集合: 其表现形式就是内存中的一段连续的内存地址: 数组名称其实就是连续内存地址的首地址: 2. 关于js中的数组定义 数组定义无需指定数据类型: 数组 ...

  9. 原生JS实现购物车结算功能代码+zepto版

    html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

随机推荐

  1. js input相关事件（转载）

    1.onfocus  当input 获取到焦点时触发. 2.onblur  当input失去焦点时触发,注意:这个事件触发的前提是已经获取了焦点再失去焦点的时候才会触发该事件,用于判断标签为空.3.o ...

  2. 详解Mybatisplus

    详解Mybatisplus ​ MyBatis-Plus(简称 MP)是一个 MyBatis的增强工具,在 MyBatis 的基础上只做增强不做改变,为简化开发.提高效率而生. 特性: 无侵入**:只 ...

  3. 如何应对C语言内存泄露！ 华为开发者社区 2020-09-29

    如何应对C语言内存泄露! 华为开发者社区 2020-09-29

  4. Linux网络数据包的揭秘以及常见的调优方式总结

    https://mp.weixin.qq.com/s/boRWlx1R7TX0NLuI2sZBfQ 作为业务 SRE,我们所运维的业务,常常以 Linux+TCP/UDP daemon 的形式对外提供 ...

  5. C段错误等调试

    本文参考 http://stackoverflow.com/questions/2179403/how-do-you-read-a-segfault-kernel-log-message和http:/ ...

  6. SpringMVC听课笔记（十五：SpringMVC 运行流程）

    1. 图 一般的会按照红线标注的方向去行进,但是请求静态资源,或者出现异常等,会出现其他路径 2.

  7. 分布式缓存 — Docker

    Docker 是一个开源项目,它基于 Google 公司推出的 Go 语言实现. 项目后来加入了 Linux 基金会,遵从了 Apache 2.0 协议,项目代码在 GitHub 上进行维护. Doc ...

  8. docker版mysql的使用和配置（1）——docker的基本操作

    最近实在是忙成狗,其他的内容等稍微闲一点了一起更新. 这篇主要是讲docker版的mysql的使用和配置信息.因为实习公司需要搞一个docker做测试环境用,还需要包括基本的依赖.最重要的是,因为这个 ...

  9. （19）ln命令：在文件之间建立链接（硬链接和软链接）

    1.ext 文件系统(Linux 文件系统)是如何工作的. 我们在前面讲解了分区的格式化就是写入文件系统,而 Linux 目前使用的是 ext4 文件系统.如果用一张示意图来描述 ext4 文件系统 ...

  10. Elasticsearch 之 Filter 与 Query 有啥不同？

    今天来了解下 Elasticsearch(以下简称 ES) 中的 Query 和 Filter. 在 ES 中,提供了 Query 和 Filter 两种搜索: Query Context:会对搜索进 ...