写在前面

一些网站可以在线生成LOGO，并支持编辑，效果还不错，但是保存和下载需要注册、登录和收费。
如果希望获取LOGO，并且确保自己不会用于商用的话，这个插件也许能帮到你！
如果对你有帮助，还请给个⭐️，欢迎fork~

插件下载

GitHub
Gitee镜像
作者GitHub主页还有很多有趣好玩的项目~

思路分析

简述一些这两个在线LOGO设计网站的操作思路：
1. 去除登录框。有的LOGO设计网站在编辑之前必须登录，不登陆不给编辑。针对这种情况，我们使用浏览器开发者工具定位登录框所在的代码位置，将相应的代码删除或者设置样式display:none即可。
2. LOGO上面有遮罩。我们知道，其实在线设计LOGO就是应用的SVG，因此我们希望通过LOGO的位置定位SVG代码所在位置，但是大部分网站定位后却是一个DIV标签。对于这种情况，我们只需要把对应位置的DIV元素删掉，再次定位，基本上就可以看到真正的SVG代码所在的位置了。
3. 开发者工具中对SVG做修改无实时效果。其实是因为网站在LOGO上面加了一层当前logo的“副本”，导致你用代码修改svg的时候，真实的svg其实已经有变化了，但是由于上面盖了一层初始的副本，导致你认为根本没有变化而已。
4. 获取不到节点。一般来说，我们不去直接获取svg，而且先获取其父元素。但是有的父元素节点根本获取不到，仔细观察，发现父元素的某一个祖先元素竟然是自定义的标签，所以用class名获取不到该自定义标签元素，自然也获取不到下面的子元素了。此时可以使用document.getElementsByTagName()的方式来获取自定义标签的元素了。
5. svg在shadow root里面。也就是说SVG是通过创建Shadow DOM的方式加载上去的。此时我们不能使用常规的parentNode.children[0]这种方式由父节点获取子节点了，而是需要多一步获取shadow root的操作，即parentNode.shadowroot.children[0]。
6. 怎么修改svg尺寸呢。其实很简单，修改svg的width属性和height属性就可以了。不过要注意width和height的比例要正确，否则会导致logo变形。

思路拓展

做成插件。项目见上述下载地址。

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：Nmap 端口扫描

下一篇：Node.js

一个插件帮你快速、免费下载两个网站的高清无水印LOGO！

文章目录

写在前面

插件下载

思路分析

思路拓展

相关内容

热门资讯