简介

浏览器自带的工具，用于开发时调试和检查网页应用的状态

打开方式

• chrome 右上角菜单，更多工具，开发者工具
• 在页面上右键，菜单里选检查（inspect）
• windows：ctrl + shift + I （或者 F12）
• mac： cmd + opt + I

element 面板

element 面板支持查找网页源代码HTML中的任一元素,手动修改任一元素的属性和样式且能实时在浏览器里面得到反馈。如下图所示：element 面板由左边DOM元素面板和右边属性面板组成

DOM元素面板

查看 DOM 元素在页面上的对应显示（可结合面板上鼠标一起用）

搜索 DOM 元素(选中面板ctrl + F)

添加删除和修改元素