New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

DevTools #3

Open

hex11o opened this issue Jul 14, 2020 · 4 comments

Owner

hex11o commented Jul 14, 2020 •

edited

Loading

通过coverage查看未使用的css

ctrl + shift + p(win), cmd + shift + p(mac)打开命令行；
输入coverage选择Show Coverage打开标签;
点击标签重载查看资源使用情况。

Owner Author

hex11o commented Jul 14, 2020 •

edited

Loading

动态调整颜色，shadow

审查元素样式右下角hover可看到添加text-、box-shadow, color/background-color.
支持吸管，复制RGB功能。

Owner Author

hex11o commented Jul 14, 2020 •

edited

Loading

console

将列表打印成表格格式，console.table([{head: 'abc'}, {head: 'efg'}])
计时器: �console.time(), (){// some code}, console.timeEnd()
$0: 最新的审查元素, $1:上一个审查元素，类推，基本不会用到...
$(selector): alias for document.querySelector()
$$(selector): alias for document.querySelectorAll()

Owner Author

hex11o commented Jul 14, 2020

network

清空缓存重载页面：打开devTools，长按刷新按钮，选择empty cache and hard reload。

Owner Author

hex11o commented Jul 17, 2020

performance

查看页面fps: 打开命令行，输入render, enable fps meter.

hex11o changed the title ~~# DevTools~~ DevTools

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment