一个 Chrome 书签小脚本 -- 找出vue实现的网站中的vue元素

没什么软用但是很有意思

原理：查询所有 dom 元素 -> 遍历 vue 属性 -> 存在这个属性的元素，修改样式，添加 border

javascript:void(function() {const vueElms = Array.from(document.querySelectorAll('*')).filter(el => el.__vue__); console.log(vueElms.length); if (vueElms.length === 0) { alert('没有发现 __vue__ 属性'); return } vueElms.forEach(el => { if (el.__vue__) { el.style.border = 'solid 1px blue'; el.style.boxSizing = 'border-box' } })}())

可以把这个小功能保存到书签中一键执行

新建书签 -> URL一栏填入上面的代码即可

然后就可以学习别人的页面布局结构 以及根据 __vue__ 属性写一些奇怪的小插件了嘿嘿嘿