Skip to content

chrome调试技巧 #33

@pangjunpeng

Description

@pangjunpeng
  1. 暂停 UI 在 Hover 状态下的展示结果(不论是hover还是onmouseover)
    操作至需要的界面,按F8,可以将界面暂停
  2. as we all know,styles中可以试试查看编辑的样式,编辑数字值时,按上/下可以+1/-1
    但是如果想opacity之类的,我们想让他按0.1来变,就可以
    • alt + 上/下 以0.1递增/递减
    • shift + 上/下 以10递增/递减
    • command + 上/下 以100递增/递减
  3. 控制台的color是可以调出调色板的,可以选颜色等等
    默认颜色值显示代码里写的,比如你写#ccc就显示#ccc,写rgba(0,0,0,0)就显示rgba(0,0,0,0),我们可以按住shift点击color旁边的色块,来改变颜色值的语法(hex、RGBA 以及 HSLA )
  4. getEventListeners(domElement)可以获取该元素下所有绑定的事件,获取到之后就可以removeEventListener来解绑了【只在控制台有效,代码里不行】
  5. 断点可以加条件,copy(obj)可以复制结构化的obj至系统剪切板,network中initiator可以查看该资源的调用栈 等等等等

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions